Javascript 将状态变量值保存到另一个以用于恢复功能不'；行不通

我正在尝试更新模式中的

人员

数组。如果用户单击“取消”按钮，它将在我单击“打开模式”时将状态人员数组设置回其以前的值

所以基本上我要做的是，当单击打开模式按钮时，将人员数组分配给另一个名为cachedPeople

this.setState（{visible:true，cachedPeople:this.state.people}）的变量

“更改Ben的年龄”按钮具有以下功能：

onPress={() => {
  const newPeople = [...this.state.people];
  newPeople[2].age = 20;
  this.setState({
     people: newPeople,
  });
}}

在取消时，我将人物数组设置为cachedPeople

this.setState({ visible: false, people: this.state.cachedPeople });

但是，
this.state.cachedPeople
的值在单击“取消”按钮之前也会变成
this.state.people
的更新值，因此不会发生还原。我不知道这是在哪里发生的

到目前为止，我尝试将其保存在this.cachedPeople上，而不是state上，但仍然会发生

下面是示例代码的要点：
您必须克隆。人员和缓存人员指向相同的资源。因此，我希望

//not the best way to clone but ...
this.setState({ visible: true, cachedPeople: JSON.parse(JSON.stringify(this.state.people))}); 

以及

以及

请告诉我是否适合您。
负责任地克隆

你不应该克隆整个状态；如果你知道你只更新了一个对象，那就没有意义了


const state=
[{年龄：10}，{年龄：11}，{年龄：12}，{年龄：13}，{年龄：14}]
康斯特下州=
[
…state.slice（0,2），
{…州[2]，年龄：20}，
…state.slice（2）
]
console.log（状态）
//[{年龄：10}，{年龄：11}，{年龄：12}，{年龄：13}，{年龄：14}]
console.log（nextState）
//[{年龄：10}，{年龄：11}，{年龄：20}，{年龄：13}，{年龄：14}]
如果您按照上述方式进行操作，会发生什么？Ben是否仍然保持在20°@82Tuskers谢谢！更新了gif和详细信息。但是，我不确定如何在这里编辑
const
新人。谢谢！但是因为我使用了lodash，所以我改用了u.cloneDeep。很好！是的
库确实是一个更好的解决方案。全部克隆当你只需要更新一个的时候，对人的信任是没有任何意义的
onPress={() => {
  const newPeople = [...this.state.people];
  newPeople[2].age = 20;
  this.setState({
     people: newPeople,
    cachedPeople: this.state.cachedPeople
  });
}}

this.setState({ visible: false, people: this.state.cachedPeople });