Question

我正在尝试通过道具将信息从“ App.js”发送到“ Display.js”（这是一个功能组件）。但是我收到错误消息：“未捕获的TypeError：无法读取未定义的属性'props'”。

将“ Display.js”从功能组件更改为类组件时，相同的代码也可以工作。

App.js

<div className="component-app">
  <Display value={this.state.next || this.state.total || "0"}></Display>
</div>

Display.js（功能组件）

cconst display = (props)=>(
    <div>
        <div>{this.props.value}</div>
    </div>
);

Display.js（类组件）

class Display extends React.Component {
    render() {
      return (
        <div >
          <div>{this.props.value}</div>
        </div>
      );
    }
}

Display.js（类组件）的代码有效，但是为什么功能组件不起作用。

Answer 1

this仅适用于基于类的组件。尝试这样

const display = (props)=>(
    <div>
        <div>{props.value}</div>
    </div>
);

错误：无法读取未定义的属性“ props”

1 个答案: