小编典典

绑定方法与不绑定方法之间的区别

reactjs

我现在已经参与了多个React项目,并且在一个项目中注意到每个新方法都没有绑定。实际差异(如果有)是什么?如果可以像第二个示例那样进行绑定,为什么还要绑定呢?

在第一种情况下,代码如下所示:

constructor(props) {
  super(props);
  this.state = { myState: false };
  this.clickMe = this.clickMe.bind(this);
}

clickMe() {
  this.setState({ myState: !this.state.myState });
}

另一个示例如下所示:

constructor(props) {
  super(props);
  this.state = { myState: false };
}

clickMe = () => {
  this.setState({
    myState: !this.state.myState
  });
}

阅读 307

收藏
2020-07-22

共1个答案

小编典典

constructure

this.clickMe = this.clickMe.bind(this);

使用bind方法,您可以进行显式this绑定以提供clickMe方法的上下文。

即。在这里反应组件范围

简而言之,您要谨慎决定什么是调用上下文范围(this绑定)。

但是随着

clickMe = () => {
  this.setState({
    myState: !this.state.myState
  });
}

Arrow function 照顾您在定义它的React
Component范围内进行词法范围绑定。无需使用 bind

如果不使用arrow function,without bind,您的函数将不会进入bindReact Component范围。

2020-07-22