Question

我即时更改数据。我想保留我的应用程序首次呈现时的状态快照，以便将其与更新后的状态进行比较。它是一个对象数组，猫鼬会生成一个_id，我可以使用它。

在componentDidMount上，我将状态存储在变量中。

let test;
componentDidMount = () => {
        this.props.fetchGeneral(_id).then(() => {
           test = this.props.general.cars;
        }).catch(() => {
          console.error(this.props.errors);
        });
      }
    } else {
      this.setState({redirect: true, url: '/'});
    }
  };

如果我这样更改状态：

this.setState({cars : newValue }) //I update the whole object

或类似这样：

this.setState({...cars : newValue })

它还将更新我的变量测试

...我认为这是因为我的“ _id”，我不知道为什么。有没有一种方法可以渲染我的应用程序时的状态快照？

我的对象的示例：

“ car”：{“ owner”：[{“ _ id”：“ 5b7af38a5b302729506b5e4b”，“ value”：“ REYNOLDS ryan“，” label“：”雷诺兹 ryan“}]，” _ id“：” 5b7af3895b302729506b5e42“，” carBrand“：” Hyundai“，” carColor“：” blue“，” carPlate“：” AA-BB-CC“}}}

Answer 1

由于@ any-moose，我在对象克隆周围进行搜索，结果发现每个对象都有一个引用，因此您必须使用深度克隆才能复制该引用。

以下是对我有用的两种方法：

JAVASCRIPT：

JSON.parse(JSON.stringify(this.props.general.cars))

LODASH：

_.cloneDeep(this.props.general.cars);

Answer 2

尝试使用Object.Assign

let newObject = Object.assign({}, this.state.object);

所以在您的代码中

let test;
componentDidMount = () => {
        this.props.fetchGeneral(_id).then(() => {
           test = Object.assign({}, this.props.general.cars);
        }).catch(() => {
          console.error(this.props.errors);
        });
      }
    } else {
      this.setState({redirect: true, url: '/'});
    }
  };

更改状态后，具有ID的状态克隆也会更改

2 个答案: