我以为我已经安全地创建了一个新状态,并在我的Redux reducer中返回了以下代码。基本上,我需要更改state.data数组中的一条记录并返回新状态。我的期望是,因为newState是全新的,所以我很好。
安装了redux-immutable-state-invariant之后,我发现我仍然有问题(下面的代码和错误)。
let newState = Object.assign({}, state);
let newData = [];
newState.data.map(function(rec){
if (rec.id === sessionIdToUpdate) {
rec.interestLevel = newInterestLevel;
newData.push(rec);
} else {
newData.push(rec);
}
});
newState.data = newData;
return newState;
和错误......
A state mutation was detected inside a dispatch, in the path: `sessions.data.0.interestLevel`
如果我注释掉该行
rec.interestLevel = newInterestLevel;
错误消失了,但这个减速器的目的也是如此。
答案 0 :(得分:1)
这是因为Object.assign({}, state)
创建了一个浅层副本,data
及其所有rec
个对象与前一个状态对象共享。如果您指定其中一个,则会改变旧状态。
您可以使用以下内容以声明方式指定新状态,而不是改变rec
:
const newState = {
...state,
data: state.data.map((rec) =>
rec.id === sessionIdToUpdate ? {...rec, interestLevel: newInterestLevel} : rec
)
};