我正在尝试在 React 中使用 setState答案

【问题标题】：I am attempting to use setState in React我正在尝试在 React 中使用 setState
【发布时间】：2020-04-21 19:04:59
【问题描述】：

我正在尝试对我的 App 类中的方法使用 setState 函数..

当前代码示例：

addRandomContact() {
this.setState({
  actors: contacts.slice(0, 6)
})

}

我希望我的联系人数组的长度从 5 变为 6。

我收到的错误如下：

TypeError：无法读取未定义的属性“setState” 添加随机联系人

【问题讨论】：

addRandomContact() 怎么称呼？看起来您丢失了 this 绑定。
我们需要查看这个函数的上下文，错误提示它不在反应组件内部。
切片数组不会增加它的长度。在您的控制台中尝试[...Array(5).keys()].slice(0, 6)。 [0, 1, 2, 3, 4] 是结果。

【解决方案1】：

"this" 关键字在这个函数内部是不可访问的，因此它是未定义的。您必须使用如下箭头功能：

addRandomContact = () => {
this.setState({
  actors: contacts.slice(0, 6)
})

【讨论】：

"Cannot read property 'setState' of undefined addRandomContact" 应该使用箭头函数来解决。
当addRandomContact 的定义位置和方式或调用位置的上下文很少时，您如何回答？
在定义函数时看起来是语法错误。
语法没问题。 this 不是App 组件的this。除了使用箭头函数之外，还有其他方法，顺便说一句。在组件构造函数中绑定或在调用时绑定。您的回答在技术上并没有错，但没有充分解决 为什么 OP 一开始就有问题。
同意，或者我们也可以在构造函数中绑定方法。

【解决方案2】：

虽然从您给定的代码库中不是很清楚问题是什么，但您可能犯的一个可能错误是您没有在该类组件的构造函数中绑定addRandomContact。尝试将以下代码粘贴到您的构造函数中并检查是否解决

this.addRandomContact = this.addRandomContact.bind(this);

【讨论】：