小编典典

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

reactjs

我对此代码有疑问: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)

谢谢


阅读 282

收藏
2020-07-22

共1个答案

小编典典

以相反的顺序回答…

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

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


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

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

或(ES6):

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

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

2020-07-22