TypeError Cannot read property map of undefined

Hi! I have a problem with the Jammming project. I passed the state of searchresults from app.js to searchresult.js and everything worked fine. Inspecting components showed me props were passed properly, until I got to tracklist.js. Here’s the problem: when trying to access this.props.tracks with map, it shows this error: Cannot read property map of undefined. The point is that if a log this.props.tracks to the console, it does print the array with 3 objects as in the searchresults state, but then it also prints ‘undefined’ and I really don’t know why! I’m stuck on step #34. Any idea why this is happening?

import React from 'react'; import Track from '../Track/Track.js'; import './Tracklist.css'; class Tracklist extends React.Component { render() { let track = this.props.tracks; console.log(track) return ( <div className='TrackList'> <Track /> </div> ); } } export default Tracklist

Hi Micaela,
your problem sounds very similar to this one posted two days ago. This answer by @elnicomapero82885037 might solve your problem:

thanks for the swift reply, I found another component rendering

<Tracklist />

and removed it. Now it works properly. :slight_smile:

1 Like

If anyone comes across this issue… please refer to my comment on this thread at Jammming (Cannot read property 'map' of undefined) - #13 by jaylendwill