Question

尝试在this.state中更新数组的一个元素我遇到了（预期的）错误但无法看到我出错的地方。我是否需要创建临时数组更新，然后将整个数组分配回状态

这基本上就是我所拥有的

this.state = { array: ['a', 'b', 'c'] };

onBack() {
  this.setState({
      array[2]: 'something' 
  });
}

Answer 1

你不能像这样更新状态。

永远不要直接改变this.state，因为之后调用setState（）可能会替换你所做的突变。把this.state看作是不可变的。

阅读React docs。

您可以这样做：

let newArray = [...this.state.array];
newArray[2] = 'somethingElse';
this.setState({array: newArray});

以上示例使用Spread Syntax。

有多种方法可以修改状态，但所有方法都应确保将数据视为不可变。您可以在React here

中阅读有关处理状态的更多信息

Answer 2

使用Object.assign({});

let array= Object.assign({}, this.state.array); //creating copy of object

array[2]="something"

this.setState({array});

Answer 3

Manoj的答案会有效，还有另一种方法可以使用更新程序函数（funtinal setState）作为setState（您可以阅读here）< / p>

onBack() {
  this.setState(prevState => {
    let newArray = prevState.array
    newArray[2] = "something"
    return { array: newArray }
  });
}

Answer 4

如果您不愿意使用扩展功能在currentArray上设置新的更新数组，则可以使用Array.from(duplicateArray)

let duplicateArray = [...currentArray] //duplicate the array into new array
duplicateArray[index].value = 'x'; // update the field you want to update
setCurrentArray(Array.from(duplicateArray )) //set the new updated array into currentArray

我为这个问题而烦恼，我进行了搜索，然后看到了这个想法，它起作用了！ https://github.com/facebook/react-native/issues/21734#issuecomment-433885436

Answer 5

创建一个临时数组更新，然后将整个数组分配回状态

var arr = [];
arr = this.state.array;
arr[2] = "something";
this.setState({
    array : arr
});

更新State数组中的一个值会对native

5 个答案: