javascript - 什么时候在构造函数( Prop )上使用普通状态？

Question

我知道他们有一些类似的问题，但我仍然对以下内容感到困惑。

什么时候使用这样的状态

Class Example extends Component {
  state = {
    name: ''
  }

 }

在构造器 Prop 上

Class Example extends Component{ 

  constructor(props) {
    super(props);

    this.state = {
      name: ''
    }
  }
}

和方法绑定(bind)有关系吗？因为我可以很好地使用 onChange 而无需像这样绑定(bind)它:

this.onChange = this.onChange.bind(this) 

我仍然可以像这样调用 onChange

onChange = (e) => {

}

<Component onChange = {this.onChange} />

Answer 1

您示例中的区别纯粹是语法上的，而不是功能上的。您可以同时使用它们以获得相同的效果。

通常，当您想根据某些运行时逻辑(例如，根据传递的 Prop )计算状态时，您会在构造函数中分配一个状态。在那种情况下，你会这样写:

class Example extends Component {
  constructor(props) {
    this.state = {
      fullName: props.firstName + ' ' + props.lastName
    }
  }
}