Question

我具有以下结构的Redux状态：

const initialState = {
  data: [
    'device_groups': [
      {
       'id': '1', 'name': 'group 1',
       'devices': [
         {'id': 11, 'name': 'device 11', 'active': 1}, 
         {'id': 12, 'name': 'device 12', 'active': 1},
         {'id': 13, 'name': 'device 13', 'active': 1}
      ]}, 
      {
       'id': '2', 'name': 'group 2',
       'devices': [
         {'id': 21, 'name': 'device 21', 'active': 1}, 
         {'id': 22, 'name': 'device 22', 'active': 0}
       ]}
    ],
   selectedDevices: [
     {'id': 11, 'name': 'device 11', 'active': 1},
     {'id': 12, 'name': 'device 12', 'active': 1},
     {'id': 21, 'name': 'device 21', 'active': 1},
     {'id': 13, 'name': 'device 13', 'active': 1}
   ]
};

在组件中，当我单击一个组时，我想从selectedDevices数组中删除所有与单击的组中的对象具有相同ID的对象。在这种情况下，ID为11、12、13的对象。

我尝试了几种方法，但似乎我始终使用相同的数组。例如，我尝试过：

const handleClickedGroup = (state, action) => {
  const updatedDevices = [...state.data.device_groups[action.groupIndex].devices].slice();
  let updatedSelectedDevices = [...state.selectedDevices].slice();
  let newSelDevices = [];

  for (let i in updatedDevices) {
    const selectedDeviceIndex = findObjectIndex(updatedSelectedDevices, updatedDevices[i], 'id');
    newSelDevices = [
      ...updatedSelectedDevices.slice(0, selectedDeviceIndex),
      ...updatedSelectedDevices.slice(selectedDeviceIndex + 1)
    ];
  }

  return updateObject(state, {selectedDevices: newSelDevices});
}

我尝试了几件事，但是没有任何效果。可以这样做吗？

更新

我想我找到了解决方法：

const updatedDevices = [...state.data.device_groups[action.groupIndex].devices].slice();
let updatedSelectedDevices = [...state.selectedDevices].slice();
return updateObject(state, {selectedDevices: updatedSelectedDevices.filter(i => !updatedDevices.some(j => j.id === i.id))});

但是我不确定我是否一成不变。有人可以确认吗？

Answer 1

最终，这对我有帮助：

const updatedDevices = [...state.data.device_groups[action.groupIndex].devices];
let updatedSelectedDevices = [...state.selectedDevices];
return updateObject(state, {
  selectedDevices: updatedSelectedDevices.filter(i => !updatedDevices.some(j => j.id === i.id))
});

从Redux状态数组中删除多个对象

1 个答案: