reactjs - 无法在 addEventListener 函数中调用 this.setState

Question

我正在尝试更改通过 DOM 方法创建的按钮的单击状态。我尝试通过函数的参数将“this”作为变量传递

var self="this"
b.addEventListener("click", function(self){
    self.setState({health:100}) })

还尝试在函数末尾添加 .bind(this) 但没有成功。

b.addEventListener("click", function(){
    this.setState({health:100}) })

Answer 1

可以使用 self 的正确声明和定义来处理此问题。或者在 arrow function(implicit Lexical scope) 的帮助下

componentDidMount(){

  //assuing b defined

  //1.  if you want to use self
  const self = this; //  this should not be double quoted;
  b.addEventListener("click", function () {
    self.setState({ health: 100 });
  }

  // 2. using arrow function ( implicit lexical scope) 
  b.addEventListener("click", ()=> {
    this.setState({ health: 100 });
  }
}