Reactjs 如何使用ES6将对象添加到数组中。。。方法？

我知道如何使用推送方法：

import * as types from '../constants/ActionTypes'

const initialState = {
  designBox: [],

}

import * as types from '../constants/ActionTypes'
const initialState = {
  designBox: [],

}

export default function(state = initialState, action) {
  switch (action.type) {
  case types.CREATE_DESIGN_BOX:
    let newState = Object.assign({}, state);
    newState.designBox.push(action.payload)
    return newState

  default:
    return state
  }
}

但是我不知道如何使用

…

方法

现在我的代码出现问题，designBox无法添加对象，
它只有一个项目，因为它刚刚被新的

action.payload

import * as types from '../constants/ActionTypes'

const initialState = {
  designBox: [],

}

export default function(state = initialState, action) {
  switch (action.type) {
  // action.payload format -> { width:200,height:300,text:'abc'}
  case types.CREATE_BOX:
    return {
      ...state,
      designBox: [action.payload]
    }
  default:
    return state
  }
}

我怎样才能做到这一点与。。。方法

使用数组析构函数

case types.CREATE_BOX:
    return {
      ...state,
      designBox: [...state.designBox,action.payload]
    }

---

无法使用对象扩展来操纵关键点，只能完全替换它们。但是，在覆盖关键点时，可以引用原始对象：

return {
  ...state,
  designBox: state.designBox.concat(action.payload)
}

---

同时，在阵列中展开阵列：

return {
  ...state,
  designBox: [...state.designBox, action.payload]
}

此外，您的状态不需要是对象。如果它只包含一个数组，请将其设置为数组：

const initialState = [];

---

initialState是数组而不是对象，这是一种常见的方式吗？如果它只有一个键，并且该键的值是数组，那么就没有理由在以后将要访问的内容嵌套到比需要更深的级别。