Reputation: 23
I have just started learning React and trying to pass props down to child component as I have seen in many tutorials & react docs.
But I can't see any props passed in my child component.
I have installed React Developer
Tools in Chrome
My code is as follows:
App.js
import React, { Component } from 'react';
import './App.css';
import Movies from './Components/Movies';
import GetMovies from './Data/MoviesServie';
class App extends Component {
constructor() {
super();
this.state = {
movies: []
};
}
componentDidMount() {
const movies = [...GetMovies()];
this.setState({ movies }); // 1. setting state
}
render() {
return <Movies movie={this.state.movie} />; // NOT WORKING
}
}
export default App;
I have also tried console logging and found following things are called in sequence
But when I see props in <Movies />
component I didn't see anything there.
Props is null/blank there.
I don't know what is the problem, every tutorial shows the method, which I am using here.
Upvotes: 2
Views: 7728
Reputation: 31565
You missed a letter
Change return <Movies movie={this.state.movie} />;
To return <Movies movie={this.state.movies} />;
Upvotes: 3