ReactJS - 在状态

Question

结帐这个例子检测变化问题：http://codepen.io/lzhelenin/pen/jVbeRg

有一个小阵营的应用程序，它的初始状态看起来是这样：

{ 
    foo: 123, 
    bar: [{ 
    cux: 456 
    }] 
} 

如果你按下按钮，它增加了一个新的state.bar中的对象并更改state.foo值。然而，如果你按下它然后看一下控制台，你会发现state.bar的状态与state.bar的状态完全一样，尽管state.foo是不同的。为什么会发生？

Answer 1

正如@广播网 - 提到，_.clone创建浅拷贝克隆，所以无论是prev和curr状态都指向同一个数组，所以你最好改变自己clickHandler()方法是这样的：

clickHandler() { 
    this.setState({ 
     foo: 999, 
     bar: [ 
     ...this.state.bar, 
     {cux: 123} 
     ] 
    }); 
    } 

Answer 2

从http://underscorejs.org/#clone：

clone_.clone（对象）创造提供 平原对象的浅复制克隆。任何嵌套的对象或数组将被复制 引用，而不是重复。

因此，您推送新值的prevState.bar和this.state.bar都是对同一个数组的引用。