javascript - 当分配的变量发生变化时，React 状态也会发生变化

Question

我遇到了 React 的一个奇怪问题。

this.state={
      testState: { testValue: "Test State" }
}
   
testFn = () => {
        let a;
        a = this.state.testState
        a.testValue = "Debugging is awesome";
        console.log(this.state.testState)
    }

如果我对分配的变量a进行了任何更改，那么它也会反射(reflect)在状态中。

我在控制台中得到的是，

{testValue:“调试非常棒”}。

任何帮助将不胜感激

编辑: 我不想改变状态。我必须修改 a 而不改变状态。我怎样才能实现这个目标？

Answer 1

状态发生变化，因为变量 a 保存了对 testState 的引用。这是一个禁止操作。您永远不应该直接更改它，而只能使用 setState React提供的功能。

this.setState({ testState: { testValue: "Debugging is awesome" } });

如果您不想更改状态，可以使用扩展运算符:

let a = { ...this.state.testState };