将对象推送到对象数组 returns 数组大小

Question

我正在使用 react-boilerplate 构建一个应用程序，人们可以在其中创建和编辑事件。这个样板使用 immutable.js 所以我想学习它。

当我将事件保存到数据库时，数据库returns将该事件作为对象。

console.log(action.payload.event)

会打印

{
  color:"#000000",
  name:"my Event",
  _id:"59ea882a58a83d20d400cd21",
}

然后我想把这个对象推送到其他事件的数组中。用户登录时会填充事件。

我的减速器是这样的

import { fromJS } from 'immutable';
import { ADD_EVENT_REQUEST_SUCCESS } from './constants';

const initialState = fromJS({
  events: null
});

function eventsOverviewReducer(state = initialState, action) {
  switch (action.type) {

    case ADD_EVENT_REQUEST_SUCCESS:
      return state
        .update('events', list => list.push( action.payload.event ));

    case LOGIN_SUCCESS:
      const user = action.payload.user;
      return state
        .set('events', user.events)

    default:
      return state;
  }
}

但是，此更新语句现在将存储中的事件设置为数组的大小。如何将我的对象推送到状态？

Answer 1

听起来你的 events 不是 Immutable.List。当您设置 events 时，您应该将其创建为列表而不是常规数组：

case LOGIN_SUCCESS:
  return state
    .set('events', List(user.events))

然后 events.push 将 return 新列表正确。

将对象推送到对象数组 returns 数组大小

Pushing an object on array of objects returns array size

javascript

immutable.js

redux

react-redux