反应绑定事件

Question

为什么我必须绑定onClick方法？ 在这种情况下，“this”指的是App类，render方法或DOM元素？

Answer 1

调用没有bind方式的函数会将其上下文（this）设置为JavaScript运行环境的全局变量。在浏览器中，它是一个窗口全局变量。

bind只是核心javascript。这是绑定事件的工作原理。这不是React概念。

您可以在构造函数本身中绑定它，而不是在事件处理程序中绑定函数。

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

Answer 2

你需要绑定onClick，因为如果不这样做，那么这将引用全局对象。

另一方面，如果你的onClick是在任何html标签中定义的，比如

Select也被视为reactjs中的一个元素，它提供了自己的 this ，其中onClick事件被绑定。

因此，如果您未将事件绑定到选择的本地事件，则会引发错误

  

typeError：函数未定义

所以绑定是可以修改的。

如果您在

等地图中返回任何内容，则同样适用

this.state.something.map(function(holidays,i) {

return  
  <div>
    <Select onClick="this.function"/>
  </div>
}, this)

Answer 3

向上 ES6 您可以更改功能＆＃34; handleChange＆＃34;像这样：

handleChange = () => {
  this.setState ({checked: !this.state.checked});
}

现在您可以调用此函数：onChange = {this.handleChange}。希望能帮到你:)。

Answer 4

在这种情况下，

this是App个实例。

至于Function.prototype.bind的作用，文档很好地描述了它：

  

bind（）方法创建一个新函数，在调用时，将其this关键字设置为提供的值，[...]

如果我们没有将this（App实例）绑定到我们的处理函数，那么当handleChange被触发时，该函数内部的this将是包含<input>事件处理程序的onChange元素。

使用bind，我们强制this成为App事件处理程序内的handleChange实例。