Question

正如我在许多教程和react docs中所看到的，我刚刚开始学习React并尝试将props传递给子组件。但是我看不到子组件中传递的任何道具。我在Chrome中有installed React Developer个工具

我的代码如下：

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 // //我在这里设置状态，但仍在记录空白数组
render（再次通过对象数组设置状态渲染）

但是，当我在<Movies />组件中看到道具时，那里什么也没看到。那里的道具为空/空白。

我不知道问题出在哪里，每个教程都显示了我在这里使用的方法。

Answer 1

您错过了一封信

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

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

反应不将道具传递给组件

1 个答案: