为什么需要在构造函数中绑定函数

Question

我对此代码有疑问：https
:
//github.com/reactjs/redux/blob/master/examples/async/containers/App.js

特别：

  constructor(props) {
    super(props)
    this.handleChange = this.handleChange.bind(this)
    this.handleRefreshClick = this.handleRefreshClick.bind(this)
  }

我猜这是一个两部分的问题。

1. 为什么我需要将句柄更改设置为类的实例，this.handleChange =我不能只对handleChange使用静态函数并直接在类中调用它 onClick={handleRefreshClick}>？
2. 我不知道这是怎么回事： this.handleRefreshClick.bind(this)

谢谢

Answer 1

以相反的顺序回答…

1. this.handleRefreshClick.bind(something)返回一个新函数，其中对的引用this将引用something。这是一种保存的当前值的方法this，该值在调用构造函数期间处于作用域内，以便稍后在调用函数时可以使用它。

2. 如果您的函数不需要访问组件的状态，那么可以肯定，您不需要绑定它们。

支持将这些行添加到构造函数的观点是，每个类的实例仅创建一次新的绑定函数。您也可以使用

onClick={this.handleRefreshClick.bind(this)}

或（ES6）：

onClick={() => this.handleRefreshClick()}

但是，每次重新渲染组件时，这两种方法都会创建一个新函数。