class LoggingButton extends React.Component {
handleClick() {
console.log('this is:', this);
}
render() {
return (
<button onClick={this.handleClick}>
Click me
</button>
);
}
}
譬如：上面的这一段代码
如果没有留意绑定 this.handleClick 的话, 直接传给 onClick，就会招 Bug 的了。
因为当 handleClick 被调用的时候，里面的 this 会是 undefined
那么怎么才能保证 this 不会指代别的，而是我们想要的呢？有以下推荐方案
方案
使用 .bind(this) 使这个函数不论怎么调用都有同样的 this 值。将上面的例子代码改一改为：
<button onClick={this.handleClick.bind(this)}>
参考：bind()
其它的两种解决方案参考：文档
网友评论