Javascript React：引用状态中的函数时出错

问题似乎很简单，但我不知道如何解决：

• 在

  渲染中声明的Add按钮

  -函数工作正常
• 在

  状态中声明的添加按钮本身不起作用。正如代码已经提到的，它将抛出
  “TypeError:cannotread属性'state'的undefined”
  -Error

类应用程序扩展组件{
构造函数（）{
超级（）；
此.state={
某些阵列对象：[{
属性：
//剪断。。。
//不行！
//单击会导致此错误：“TypeError:无法读取未定义的属性“state”
添加
//剪断。。。
}]
};
this.doAction=this.doAction.bind（this）；
}
//剪断。。。
doAction（）{
console.log（this.state）；
}
render（）{
返回(
//剪断。。。
//很好用
添加
)
}
}

---

我遗漏了什么？

您需要在

状态之前绑定函数
doAction

constructor() {
    super();

    this.doAction = this.doAction.bind(this);

    this.state = {
      someArrayOfObjects: [{
          attr: 
             // SNIP ...
                // Doesn't work!
                // When clicked leads to this error: "TypeError: Cannot read property 'state' of undefined"
                <button onClick={this.doAction}>Add</button>
             // SNIP ...
        }]
    };

  }


因此，可能令人困惑的是，
this.doAction
指的是代码中不同点上的两个不同函数。您希望将绑定版本传递给处理程序（请参阅上面的链接了解原因），因此需要在创建该按钮之前绑定它。
请检查沙盒中的代码：

在这里您可以看到，我们需要在将方法添加到状态之前定义该方法。
首先，我们需要定义
doAction
方法，然后定义state，因为它在state中使用。
尝试使用箭头函数
this.doAction}>Add
如果要绑定doAction，请在将其传递到state声明中的组件之前执行该操作。否则，当调用该函数时，这将是未定义的。@Sam谢谢，但箭头函数不起作用这是正确的答案，但可以通过解释原因加以改进。@JaredSmith补充了一些解释，我认为这不是最好的：/I写得太好了这是一个非常好的第一步。我为您润色了它，如果您有任何问题，请告诉我，如果您认为可以更清楚的话，请随意编辑它。回答得好。@rMonteiro谢谢你，这很有魅力。不知道为什么我没有试着自己把线移到顶端。然而：我应该总是把它们放在最上面吗？或者有什么缺点吗？@trynalearn我认为把绑定放在顶部没有缺点，但你只需要在这样的情况下这样做。这应该是对rmontiero答案的编辑，因为它不是独立的答案。
constructor() {
    super();

    this.doAction = this.doAction.bind(this);

    this.state = {
      someArrayOfObjects: [{
          attr: 
             // SNIP ...
                // Doesn't work!
                // When clicked leads to this error: "TypeError: Cannot read property 'state' of undefined"
                <button onClick={this.doAction}>Add</button>
             // SNIP ...
        }]
    };

  }


this.doAction = this.doAction.bind(this);