如何在状态中的对象内部的对象内部的数组中追加项目？

Question

我有这种状态：

{
'guy1': {...},
'guy2':{...},
'guy3: {'key1': [...], 'key2': [...]}
}

我想在key2内附加一个项目。

我尝试了所有这些（这些都不起作用） ：

guy3: {...prevState.guy3, key2: prevState.guy3.key2.concat([item])}

要么

guy3: {...prevState.guy3, key2: [...prevState.guy3.key2, item]}

要么

let key2 = this.state.guy3.key2.slice();
key2.push(item);
this.setState(prevState => {
   guy3: {...prevState.guy3, key2}
};

我该如何进行这项工作？

Answer 1

您可以使用：

this.setState(prevState => ({
   ...prevState, 
   guy3: {
      ...prevState.guy3,
      key2: [...prevState.guy3.key2, item] 
   }
}));

或者，利用API轻松创建更新的对象，同时保持不变性。 例如immutability-helper ：

this.setState(prevState => update(prevState, { guy3: { key2: {$push: item} } }));