有没有办法在reducer新添加的对象中解构？答案

【问题标题】：Is there way to destructure in reducer new added object?有没有办法在reducer新添加的对象中解构？
【发布时间】：2019-10-11 14:53:29
【问题描述】：

我正在应用程序上学习 redux，当您单击日历中的日期时，它会显示表单。提交后，redux 应该从这个表单中获取数据，并放入如下状态：[obj, obj, obj]。 -> // 日期 == 活动日期

我无法解构日期，因此它会发生变异，并且每次点击提交时我在日期数组中只有一个对象。

    case SET_DATE:
       return {
         ...state,
          activeDate: action.payload.date
       }
    case ADD_CUT:
    const {date, name, hour, minute, kind} = action.payload
        return {
            ...state,
            appointments: {
                ...state.appointments,
                [date]: [
                       // here i need to destructure sth like
                       // ...state.appointments.date
                       // or state.appointments.activeDate
                    {
                        name: name,
                        hour: hour,
                        minute: minute,
                        kind: kind
                    }
                ]
            }
    }

如何解构它？或者我应该以不同的方式获取数据？

【问题讨论】：

你的 state.appointments 是一个数组吗？如果是数组，你想通过action.payload中的值添加一个项目吗？
state.appointments 应该是对象，当我单击日期并提交时，它应该得到（单击日期）：[{obj}]。如果我通过提交将另一个对象添加到这一天，它应该是（点击日期）：[{obj}，{newObject}] 等。
你能用数据举例说明你的状态吗？
state={ activeDate: "20-12-2019", appointments: { "20-12-2019": [ {name, time, kind}, {name, time, kind}, ], "14-10-2018": [ {name, time, kind}, {name, time, kind}, {name, time, kind}, ] } }
我认为将约会设置为数组并在那里添加项目会容易得多。保持简单。

标签： javascript reactjs ecmascript-6 redux react-redux

【解决方案1】：

我会将约会保存在一个数组中，然后像这样简单地向其中添加新约会：


case ADD_CUT:
    const {date, name, hour, minute, kind} = action.payload;
   return {
       ...state,
       appointments: [
           ...state.appointments,
               {
                   date,
                   name,
                   hour,
                   minute,
                   kind
               }
          ]
  }

【讨论】：

是的，它会工作，但我想要这样的数据结构：约会：{ "20-12-2018":[{name, hour, minute, kind}, another obj from intput, ...] ,]}
@KamilDulęba 最好在这里使用数组，为什么要保留对象？
我坚持，这样当我想将约会添加到特定日期时，我只会做 state.appointments.{date selected on calendar}.map 但我认为你是对的，没有理由让生活更艰难。我将使用您的结构并在渲染时对其进行过滤。感谢您的帮助。