Jammming Project , TypeError: Cannot read property 'map' of undefined

Hi there,

In “Jammming Project”, I followed exactly the code and double-checked the project workthrough video.

All was fine until task 34: * “In the TrackList component, use the .map() method to render each track in the tracks property.
Set the key attribute to track.id .”*

I get the error: TypeError: Cannot read property ‘map’ of undefined as attached:

When I went one step back and inspected the page I found that the props is existing.

Please advise for what could be the proplem !!!

I have the same problems. I figure this could happen due to a way computer tries to undestand text writing in Visual Studio Code.

The way I fixed it (at least worked for me), is to go back to App.js, in the SearchResults Component, copy and paste every single instant of searchResults, and copy and paste it to SearchResults.js. This, at least to ensure that, even though the text looks the same, they are not the same.

This happens to me a couple times as I was coding Ruby on Rails, and I realized that when I copy and paste text into an app, it might be different from the one that I wrote directly.

1 Like

Thanks a lot.

I tried it and problem solved.

can you please be more specific?

Hi, it means that when you have a variable, Class or Object that is exported from one .js to another .js, you should:

  1. Rewrite this variable
  2. Copy and paste this variable from one file to another

I was explained that this is due to how computer encodes text. So if you copy a piece of code from a someone’s else computer, and paste it into your VSC, it might have different encoding.