将数组项添加到对象键的有效方法

Question

我有一个来自服务器的值。 它包含与我的状态对象中具有相同键的对象。 该对象的键值是具有一个项目的数组。 要在我的reducer中处理这个值，我需要将这个数组项添加到我的状态中的现有对象键。

简而言之：

我来自服务器： { TEST: ['item1'] }

我的状态是： { TEST: ['item2'], TEST2: ['item3'] }

预期结果： { TEST: ['item1', 'item2'], TEST2: ['item3'] }

const handleCreateItemFilter = (state, { payload }) => {
  const { list  } = payload;
  const updatedList = { ...state.regions.list };
  updatedList[Object.keys(list).join()] = [...updatedList[Object.keys(list).join()], Object.values(list).join()];
  return {
    ...state,
    regions: {
      ...state.regions,
      list: updatedList,
    },
    selectedFilter: {
      ...state.selectedFilter, unassignedCountries: [], regions: Object.keys(list).join(),
    },
  };
};

目前，我在上面的例子中解决了它：创建新的updatedList，从服务器找到我的对象的适当的键，并分配给我的旧对象数组的旧键值和新的键值。 但我认为解决这个问题不是好方法。

Answer 1

所以，我真的不知道为什么你在根状态而不是数组上使用对象，但是，如果我需要使用它，我会做这样的事情：

 const response = { TEST: ['item1'] } const stateInitial = { TEST: ['item2'], TEST2: ['item3']} const expected = JSON.stringify({ TEST: ['item1', 'item2'], TEST2: ['item3']}) const reducer = (state = stateInitial, { payload }) => { return [ ...Object.entries(payload).map(([k, v]) => ( typeof stateInitial[k] !== 'undefined' ? [ k,[...v, ...stateInitial[k],]] : [k, v] )) ].reduce((obj, [k, v]) => ({ ...obj, [k]: v }), stateInitial) }; try { const output = JSON.stringify(reducer(undefined, { payload: response})) if (output != expected) { throw `reducer return something different: \\n${output} \\n\\nand expect \\n\\n${expected}` } console.log('the test is passed') } catch (error) { console.error(error) }