jak
jak

Reputation: 23

React not passing props to component

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

Answers (1)

Vencovsky
Vencovsky

Reputation: 31565

You missed a letter

Change return <Movies movie={this.state.movie} />;

To return <Movies movie={this.state.movies} />;

Upvotes: 3

Related Questions