react-redux数组添加列表

Question

这是我“添加列表”的redux代码的一部分。

当请求进来时，我想填充list_01, list_02, list_03, list_04, list_06。

但lockerReducer似乎在填写这些列表时遇到了问题。

我想直接访问list_01, list_02, list_03, list_04, list_06，以便将数组列表放入其中。

有人知道答案吗？

import _ from 'lodash'

export const lockerState = {
  locker: {
    list_01: [],
    list_02: [],
    list_03: [],
    list_04: [],
    list_06: []
  }
}

export const lockerAction = {
  INIT_LIST: 'INIT_LIST',

}

// REDUCERS
export const lockerReducer = (state = lockerState, action) => {
  switch (action.type) {
    case lockerAction.INIT_LIST:

      switch (action.payload.menu) {
        case '01':
          console.log(action.payload.menu, action.payload.list, action.payload.menu)
          return {
            ...state,
            list_01: [state.locker.list_01, action.payload.list]
          }
        case '02':
          return {
            ...state,
            list_02: [state.locker.list_02, action.payload.list]
          }
        case '03':
          return {
            ...state,
            list_03: [state.locker.list_03, action.payload.list]
          }
        case '04':
          return {
            ...state,
            list_04: [state.locker.list_04, action.payload.list]
          }
        case '06':
          return {
            ...state,
            list_06: [state.locker.list_06, action.payload.list]
          }
        default:
          return {
            ...state,
            list_01: [...state.locker.list_01, action.payload.list]
          }
      }

    default:
      return state
  }
}

// ACTION CREATOR
export const initList = (category, list, menu) => {
  //console.log('initList action creator-> ', category, list, menu)
  return {
    type: lockerAction.INIT_LIST,
    payload: {
      category, list, menu
    }
  }
}

没有错误消息，但结果不是我所期望的

Redux Dev tool - Result Img

Answer 1

如果您试图从现有列表+新的项目数组创建新列表，则必须使用扩展运算符。您现在正在做的是在列表中创建嵌套列表。如果您正在尝试创建单级列表，请参考下面的代码。

return {
    ...state,
    list_02:[...state.locker.list_02, ...action.payload.list]
}