Cannot read property of map undefined (Jammming)

I’ll be honest, I’m totally stuck on this project and I can’t find a solution to this issue. I’m not the best with React & JSX by the way. Thanks in advance.

Track.js

import React from 'react';
import './Track.css';

class Track extends React.Component {
	constructor(props){
		super(props);
		this.addTrack = this.addTrack.bind(this);
		this.removeTrack =this.removeTrack.bind(this);
	}

renderAction() {
	if(this.props.isRemoval) {
		return <button className="Track-action" onClick={this.removeTrack}>-</button>
	} else {
       return <button className="Track-action" onClick={this.addTrack}>+</button>
	}

}

addTrack() {
	this.props.onAdd(this.props.track); 
}

removeTrack() {
	this.props.onRemove(this.props.track);
}

	render() {
		return(
<div className="Track">
  <div className="Track-information">
    <h3>{this.props.track.name}</h3>
    <p>{this.props.track.artist} | {this.props.track.album}</p>
  </div>
  {this.renderAction()}
</div>

	)
	}
};


export default Track;

TrackList.js

import React from 'react';
import './TrackList.css';
import Track from '../Track/Track';



class TrackList extends React.Component {
	render() {
		return(
<div className="TrackList"> {
	this.props.tracks.map(track => {
		return <Track track={track} key={track.id} 
    	onRemove={this.props.onRemove} isRemoval={true} />

    }

    )

	}
	</div>
	)

	};
};
	




export default TrackList;

You opened many threads! :smiley: I would suggest you avoid that, as you can continue on topic in only one thread. :slight_smile:

I answered you in the other thread, too.

Seeing here you formatted the code, may I suggest you wrap the return of this code:

between parentheses?.. like:

return (
    // You Track component here
);

Would that help?

Apologies mate. I’ve wrapped the return code with a track component embedded below:

return (
		<Track track={track} key={track.id} 
    	onRemove={this.props.onRemove} isRemoval={true} />
    	);

Thanks

Actually I tell you what mate, I’ll return to the other thread just to keep the consistency and rhythm, and post the appropriately formatted code there. Sorry for any confusion.

1 Like