在 React 中的 setState 之前编辑 this.state 内容

IT技术 reactjs
2021-05-22 19:14:24

我想知道这种代码是否会引起副作用。

假设我在包含一个数组的组件中有一些状态对象,该数组本身包含具有各种属性的对象:

getInitialState: function () {
        return {
            willContainObjects: [];
}

现在,我有一个函数可以编辑该对象,然后创建一个新的状态对象:

editObjectInArray: function (index) {
    var obj= this.state.willContainObjects[index];
    obj.someProp = 3; // mutating this.state!!!
    this.setState({
    willContainObjects: this.state.willContainObjects.slice(0, index)
                       .concat(details)
                       .concat(this.state.willContainObjects.slice(index+1))
    }); // end setState
},

obj.someProp = 3this.state直接改变状态,但就在调用this.setState并导致重新渲染之前。在调用之前这种直接的状态突变会setState产生任何意想不到的副作用吗?我知道 React 建议不要这样做,但我认为这是一个例外。我可以Object.assign用来创建一个新对象而不是变异,但在这种情况下我没有看到这样做的意义。

1个回答

唯一的“副作用”是任何使用 PureRenderMixin 或实现shouldComponentUpdate使用浅等式测试方法的组件可能无法理解对象确实已更改。

除此之外,虽然不推荐,但它应该可以正常工作。