Reputation: 525
Am still new to Reactjs, thought have tried all I can, but still can't get through this error "TypeError: Cannot read property 'id' of undefined
"
please someone help below is my code.
if(this.props.controller === 'location'){
eventData = Object.keys(this.props.heda).map( evKey => {
return Object.keys(evKey).map( post => {
return [...Array(this.props.heda[evKey][post])].map( lol => {
return <Event key= {lol['id']}
descriptions = {lol['description']}
headings = {lol['title']}
id = {lol['id']}
clicked = { ()=> this.viewSelectedEvent(lol['id']) }/>;
}) ;
});
});
}
Error full stacktrace:
here is my data from flask that am trying to loop.Am trying to convert each object into an array, then loop through the array. I also tried to console.log(lol) and i get the data as in the image below
events = [
{
'id': 1,
'title': u'HHGHHMjshjskksjks',
'description': u'Cras justo odio dapibus ac facilisis in egestas eget qua ',
'location':'jkknxjnj',
'category':'party',
'rsvp': False,
'event_owner':1
},
{
'id': 2,
'title': u'khjhjshjsjhdndjdh',
'description': u'jhhnbsbnsbj',
'location':'jhjhsjhjhsjhjdhsd',
'category':'party',
'rsvp': False,
'event_owner':2
},
{
'id': 3,
'title': u'jhjshjsdhjshdjshjsd',
'description': u'Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec elit non mi porta gravida at eget metus.',
'location':'kjkshjhjhjbsnbsd',
'category':'party',
'rsvp': False,
'event_owner':2
},
{
'id': 4,
'title': u'jjhjshjhsjhjshjjhjhd',
'description': u'Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec elit non mi porta gravida at eget metus.',
'location':'kjisisiisdsds',
'category':'party',
'rsvp': False,
'event_owner':2
},
{
'id': 5,
'title': u'uiujsdshuuihuyksjhjs',
'description': u'Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec elit non mi porta gravida at eget metus.',
'location':'sjnsisuis',
'category':'party',
'rsvp': False,
'event_owner':2
},
{
'id': 6,
'title': u'iusijksuiksuhj suyuys jhu ',
'description': u'Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec elit non mi porta gravida at eget metus.',
'location':'isuisiiws',
'category':'party',
'rsvp': False,
'event_owner':2
},
{
'id': 7,
'title': u'jujusi jsuoios jshuysd',
'description': u'Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec elit non mi porta gravida at eget metus.',
'location':'area h',
'category':'party',
'rsvp': False,
'event_owner':2
},
]
Upvotes: 1
Views: 447
Reputation: 1010
Please try below snippet:
this.props.heda.map((evVal, evKey) => {
return evVal.map((postVal, postKey) => {
...
}
}
Now this.props.heda[evKey][postKey] will give you the expected object.
Upvotes: 0
Reputation: 18
Because he is not able to find id in this.props.heda[evKey][post]
object. So firstly you should console your this.props.heda[evKey][post]
object after that I think you will get your actual problem.
Upvotes: 0
Reputation: 139
With [...Array(this.props.heda[evKey][post])]
you create an array which has as the first element the array this.props.heda[evKey][post])
.
Maybe you wanted to say [...this.props.heda[evKey][post]]
to create a clone of the array?
Upvotes: 1