有没有办法在修改JavaScript中的部分响应时保留api响应数据

问题描述

在某些情况下，我想通过将当前状态与从API获得的原始数据进行比较来验证React应用程序中的数据。当我需要修改数组内的嵌套元素时，在保存原始数据时遇到了问题。

例如，使用以下数据：

{
  id: 1,items: [{name: "foo"},{name: "bar"}]
}

以及以下React组件摘录：

constructor(props) {
  super(props);
  this.state = {
    originalData: null,items: [],};
}

componentDidMount() {
  Api.get("/data").then(res => {
    this.setState({
      originalData: res.data,items: res.data.items,}
  });  
}

如果this.state.items[0]变成{name: "baz"}，则this.state.originalData.items[0]也将被修改。设置res.data.items.slice()时，我尝试使用[...res.data.items]和this.state.items来制作数组的副本，但这没有帮助。

我看到的两个解决方案是：

1. 在需要验证当前状态时调用API以获取原始数据
2. 使用JSON.parse(JSON.stringify(res.data))在res.data中存储一个不引用this.state.originalData的新对象。

有没有更优雅的解决方案？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）