如何在redux中的Immutable Js Map中深层添加新的键值对对象?

时间:2017-08-22 08:04:32

标签: reactjs object redux immutable.js

我尝试在items内逐个添加新的键值对象,如下所示:

{
  appElements: {
    layers: {
      layer_1: {
        background: {
          width: '100px',
          height: '100px',
          bgColor: '#aaaaaa',
          bgImage: 'http:bgimage1.png'
        },
        items: {
          yrgroih9: {
             width: '100px',
             x: '200px'
           },
           qhy0dukj: {
             width: '100px',
             x: '200px'
           },
           '7lw2nvma': {
             width: '100px',
             x: '200px'
           }
        }
      }
    }
  }
}

用于在items内添加新对象的代码:

case 'ADD_OBJECT':
  return state.setIn(["appElements","layers","layer_1","items"],{
    [action.objData.item_id]: {
      "width": action.objData.width,
      "x": action.objData.x
    },
  });

尝试在items内添加的第一个输入对象完美无缺:

yrgroih9: {
  width: '100px',
  x: '200px'
}

Redux商店数据排列(来自chrome redux devtools): enter image description here

但添加另一个对象将删除第一个条目并添加当前条目。

还尝试了updateIn功能,它无效。

如何添加对象而不删除旧对象。

1 个答案:

答案 0 :(得分:0)

应该是这样的:

return state.setIn(
  ["appElements","layers","layer_1","items", action.objData.item_id], 
  fromJS({
      "width": action.objData.width,
      "x": action.objData.x
  }));