Блог

Я только начал изучать React и пытаюсь передать реквизит дочернему компоненту, как я видел во многих руководствах и документах react. Но я не вижу никаких реквизитов, переданных в моем дочернем компоненте. У меня есть installed React Developer инструменты в Chrome

Мой код выглядит следующим образом:

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;
  

Я также попробовал ведение журнала в консоли и обнаружил, что следующие вещи вызываются последовательно

• вызван конструктор (очевидно)
• визуализация
• componentDidMound // здесь я устанавливаю состояние, но по-прежнему регистрируется пустой массив
• рендеринг (снова рендеринг с состоянием задается массивом объектов)

Но когда я вижу реквизиты в <Movies /> компоненте, я ничего там не вижу. Реквизит там нулевой / пустой.

Я не знаю, в чем проблема, в каждом руководстве показан метод, который я использую здесь.

Вы пропустили букву

Изменить return <Movies movie={this.state.movie} />;

Для return <Movies movie={this.state.movies} />;