How to map an array of objects stored in Redux inside the render() using ES6React-Native + Redux: fetching data from API as an array of objects and rendering in list componentReact Native setState in component updating redux storeReact-Native ListView with Object ArrayHow redux work when multiple components use parts of complex objects for it's sourceReact native + redux + empty objectMap state to props not updating after ReduxHow to pass JSON data to react-native-maps-super-clusterHow to fix this error 'undefined is not an object'?React Native FlatList won't re-render when the last element in an array deletedError when I was trying to render a map of items
What to do if SUS scores contradict qualitative feedback?
correct spelling of "carruffel" (fuzz, hustle, all that jazz)
What are the holes in files created with fallocate?
In books, how many dragons are there in present time?
Is the circle homeomorphic to a 6 petal rose?
Is there any good reason to write "it is easy to see"?
On what legal basis did the UK remove the 'European Union' from its passport?
Interior smooth regularity
Why was Endgame Thanos so different than Infinity War Thanos?
LWC1513: @salesforce/resourceUrl modules only support default imports
Does SQL Server allow (make visible) DDL inside a transaction to the transaction prior to commit?
How to cope with regret and shame about not fully utilizing opportunities during PhD?
Why is it harder to turn a motor/generator with shorted terminals?
Why does my circuit work on a breadboard, but not on a perfboard? I am new to soldering
How exactly does artificial gravity work?
Unbounded Fredholms operators
Is it practical to use a slug-tuned variable inductor in an antenna matcher (aka "antenna tuner")?
Centering subcaptions in a tikz pgfplot subfigure environment?
What's the difference between "за ... от" and "в ... от"?
Replace all items that are not belong to characters and numbers by ' '
Frame adjustment for engine
What is the best way for a skeleton to impersonate human without using magic?
Ex-manager wants to stay in touch, I don't want to
Why does the Earth follow an elliptical trajectory rather than a parabolic one?
How to map an array of objects stored in Redux inside the render() using ES6
React-Native + Redux: fetching data from API as an array of objects and rendering in list componentReact Native setState in component updating redux storeReact-Native ListView with Object ArrayHow redux work when multiple components use parts of complex objects for it's sourceReact native + redux + empty objectMap state to props not updating after ReduxHow to pass JSON data to react-native-maps-super-clusterHow to fix this error 'undefined is not an object'?React Native FlatList won't re-render when the last element in an array deletedError when I was trying to render a map of items
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;
New to RN and trying to understand object mapping. I can't seem to get the StackO answers similar to this to work in my app. I'd get this.props.locations was undefined, so I initialized the object with the object 'latlons' you see in the data structure below.
this.props.locations
"latlons":
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"0":
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"1":
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"2":
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"3":
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"4":
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"5":
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
As I'm using RN 0.59.1 and React 16.8, I tried:
render()
const Test = (locations) => (
<>
this.props.locations.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
But it doesn't print anything in the view. What am doing wrong?
Edit: I do have Redux configured correctly, because if I console.log(this.props.locations) it'll show me the correct data structure above. So just having trouble mapping to the rendered component.
react-native
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
add a comment |
New to RN and trying to understand object mapping. I can't seem to get the StackO answers similar to this to work in my app. I'd get this.props.locations was undefined, so I initialized the object with the object 'latlons' you see in the data structure below.
this.props.locations
"latlons":
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"0":
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"1":
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"2":
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"3":
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"4":
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"5":
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
As I'm using RN 0.59.1 and React 16.8, I tried:
render()
const Test = (locations) => (
<>
this.props.locations.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
But it doesn't print anything in the view. What am doing wrong?
Edit: I do have Redux configured correctly, because if I console.log(this.props.locations) it'll show me the correct data structure above. So just having trouble mapping to the rendered component.
react-native
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
does your data is really an object. if that is the case, you can't map it.
– Mervzs
Mar 23 at 13:21
add a comment |
New to RN and trying to understand object mapping. I can't seem to get the StackO answers similar to this to work in my app. I'd get this.props.locations was undefined, so I initialized the object with the object 'latlons' you see in the data structure below.
this.props.locations
"latlons":
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"0":
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"1":
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"2":
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"3":
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"4":
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"5":
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
As I'm using RN 0.59.1 and React 16.8, I tried:
render()
const Test = (locations) => (
<>
this.props.locations.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
But it doesn't print anything in the view. What am doing wrong?
Edit: I do have Redux configured correctly, because if I console.log(this.props.locations) it'll show me the correct data structure above. So just having trouble mapping to the rendered component.
react-native
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
New to RN and trying to understand object mapping. I can't seem to get the StackO answers similar to this to work in my app. I'd get this.props.locations was undefined, so I initialized the object with the object 'latlons' you see in the data structure below.
this.props.locations
"latlons":
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"0":
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"1":
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"2":
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"3":
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"4":
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"5":
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
As I'm using RN 0.59.1 and React 16.8, I tried:
render()
const Test = (locations) => (
<>
this.props.locations.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
But it doesn't print anything in the view. What am doing wrong?
Edit: I do have Redux configured correctly, because if I console.log(this.props.locations) it'll show me the correct data structure above. So just having trouble mapping to the rendered component.
react-native
react-native
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
asked Mar 23 at 13:05
Levi BeersLevi Beers
1
1
does your data is really an object. if that is the case, you can't map it.
– Mervzs
Mar 23 at 13:21
add a comment |
does your data is really an object. if that is the case, you can't map it.
– Mervzs
Mar 23 at 13:21
does your data is really an object. if that is the case, you can't map it.
– Mervzs
Mar 23 at 13:21
does your data is really an object. if that is the case, you can't map it.
– Mervzs
Mar 23 at 13:21
add a comment |
1 Answer
1
active
oldest
votes
Try to change your data structure into an array,
Like This:
example = [
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
]
Edited 1:
in addition i think one of your mistake is you pass a function inside render. modify your const test just a normal component value
Like this:
render()
const Test = (
<>
sample.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
}
It will work now. Hope it helps :D
answered Mar 23 at 13:25
MervzsMervzs
54814
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55314015%2fhow-to-map-an-array-of-objects-stored-in-redux-inside-the-render-using-es6%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Try to change your data structure into an array,
Like This:
example = [
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
]
Edited 1:
in addition i think one of your mistake is you pass a function inside render. modify your const test just a normal component value
Like this:
render()
const Test = (
<>
sample.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
}
It will work now. Hope it helps :D
answered Mar 23 at 13:25
MervzsMervzs
54814
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
add a comment |
Try to change your data structure into an array,
Like This:
example = [
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
]
Edited 1:
in addition i think one of your mistake is you pass a function inside render. modify your const test just a normal component value
Like this:
render()
const Test = (
<>
sample.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
}
It will work now. Hope it helps :D
answered Mar 23 at 13:25
MervzsMervzs
54814
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
add a comment |
Try to change your data structure into an array,
Like This:
example = [
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
]
Edited 1:
in addition i think one of your mistake is you pass a function inside render. modify your const test just a normal component value
Like this:
render()
const Test = (
<>
sample.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
}
It will work now. Hope it helps :D
answered Mar 23 at 13:25
MervzsMervzs
54814
Try to change your data structure into an array,
Like This:
example = [
"latitude": "0",
"longitude": "0",
"accuracy": "0"
,
"latitude": 37.33382825,
"longitude": -122.07735141,
"accuracy": 5
,
"latitude": 37.35304318,
"longitude": -122.1073468,
"accuracy": 5
,
"latitude": 37.37664016,
"longitude": -122.14817958,
"accuracy": 5
,
"latitude": 37.38885423,
"longitude": -122.15958014,
"accuracy": 5
,
"latitude": 37.40479565,
"longitude": -122.1870328,
"accuracy": 5
,
"latitude": 37.412672,
"longitude": -122.20550149,
"accuracy": 5
]
Edited 1:
in addition i think one of your mistake is you pass a function inside render. modify your const test just a normal component value
Like this:
render()
const Test = (
<>
sample.map(locations => (
<Text> key=locations.latitude locations.longitude</Text>
))
</>
);
return (
<View style=styles.container>
<View>
Test
</View>
</View>
);
}
It will work now. Hope it helps :D
answered Mar 23 at 13:25
MervzsMervzs
54814
edited Mar 23 at 13:32
answered Mar 23 at 13:25
MervzsMervzs
54814
answered Mar 23 at 13:25
MervzsMervzs
54814
answered Mar 23 at 13:25
MervzsMervzs
54814
54814
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
add a comment |
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
Thank you! After changing my data structure I'm able to access the data.
– Levi Beers
Mar 23 at 13:54
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55314015%2fhow-to-map-an-array-of-objects-stored-in-redux-inside-the-render-using-es6%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
does your data is really an object. if that is the case, you can't map it.
– Mervzs
Mar 23 at 13:21