更新对象的嵌套数据数组(Redux) [英] Update nested data arrays of object (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的调用的结构来展开相应的子数组。

这篇关于更新对象的嵌套数据数组(Redux)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！