我在更新不可变的redux和完全嵌套的数据时遇到问题。这是我的数据结构以及我要更改的示例。如果有人可以向我展示使用ES6和传播运算符访问此更新的模式,我将不胜感激。😀
const formCanvasInit = { id: guid(), fieldRow: [{ id: guid(), fieldGroup: [ { type: 'text', inputFocused: true }, // I want to change inputFocused value { type: 'text', inputFocused: false }, ], }], // ... };
假定数据完全按照所示设置,并使用给定的数组索引,这应该可以解决问题:
const newData = { ...formCanvasInit, fieldRow: [{ ...formCanvasInit.fieldRow[0], fieldGroup: [ { ...formCanvasInit.fieldRow[0].fieldGroup[0], inputFocused: newValue }, ...formCanvasInit.fieldRow[0].fieldGroup.slice(1, formCanvasInit.fieldRow[0].fieldGroup.length) ] }] };
如果要动态确定要更改的元素的索引,则需要使用诸如filter查找和删除要更新的数组元素之类的功能,然后通过编辑对的调用结构来传播相应的子数组slice。
filter
slice