"2019-03-14 回答 在 JavaScript 类中,默认情况下方法并没有被绑定。这意味着他们的 this 上下文可以被改变(例如:事件处理方法中 this 为正在侦听事件的元素)但不排除为组件实例。要解决此问题,可以使用 Function.prototype.bind() 强制将组件实例作为 this 上下文。 .."

在 React 组件类中如何保证 `this` 为正确的上下文?

2019-03-14

回答

在 JavaScript 类中,默认情况下方法并没有被绑定。这意味着他们的 this 上下文可以被改变(例如:事件处理方法中 this 为正在侦听事件的元素)但不排除为组件实例。要解决此问题,可以使用 Function.prototype.bind() 强制将组件实例作为 this 上下文。

constructor(props) {super(props);
    this.handleClick = this.handleClick.bind(this);
}
handleClick() {// Perform some logic} 
handleClick = () => {
  console.log('this is:', this);
}

render() {
  return (
    <button onClick={this.handleClick}>
      Click me
    </button>
  );
} 
<button onClick={e => this.handleClick(e)}>Click me</button> 

加分回答

返回总目录

30 秒面试系列一

感谢    关注    收藏    赞同    反对    举报    分享
回帖    
请输入回帖内容...