Pass the search results from the SearchResults
component to the TrackList
component.
i follow the vid but when i enter dev tools the props is not getting pass
import React from 'react';
import './SearchResults.css';
import TrackList from '../TrackList/TrackList';
class SearchResults extends React.Component {
render(){
return (
<div className="SearchResults">
<h2>Results</h2>
<TrackList tracks={this.props.SearchResults} />
</div>
);
}
}
export default SearchResults;
import React from 'react';
import SearchBar from '../SearchBar/SearchBar';
import './App.css';
import SearchResults from '../SearchResults/SearchResults';
import Playlist from '../Playlist/Playlist';
class App extends React.Component{
constructor(props){
super(props);
this.state= {
SearchResults: [
{name: 'name1', artist: 'artis1', album: 'album1', id: 1},
{name: 'name2', artist: 'artis2', album: 'album2', id: 2},
{name: 'name3', artist: 'artis3', album: 'album3', id: 3}
]
};
}
render(){
return <div>
<h1>Ja<span className="highlight">mmm</span>ing</h1>
<div className="App">
<SearchBar />
<div className="App-playlist">
< SearchResults searchResults={this.state.SearchResults}/>
< Playlist />
</div>
</div>
</div>
}
}
export default App;