不可变 JS - 合并从数组创建地图对象列表

Question

我正在使用 redux 和 immutablejs，我正在尝试创建一个 reducer 函数。

我遇到了一些我没想到的行为

const a = new Immutable.Map({
  numbers: [{id: 1},{id: 2}]
});

const b = a.merge(
  {
    numbers: [{id: 4},{id: 5}]
  }
);

这是a 和b 的值

a.get("numbers");
[Object, Object]
b.get("numbers");
List {size: 2, _origin: 0, _capacity: 2, _level: 5, _root: null…}
b.get("numbers").get(0);
Map {size: 1, _root: ArrayMapNode, __ownerID: undefined, __hash: undefined, __altered: false} 

我没想到numbers 是一个不可变的 Map 对象列表。

在我的应用程序中，使用 redux，我将初始状态设置为：

const initialState = new Immutable.Map({
  error: null,
  isBusy: false,
  films: []
});

我是减速器，当我获取电影时，我会尝试如下合并它们：

return state.merge({
        isBusy: false,
        films: action.payload,
        error: null
      });

这会导致 react 组件出现问题，因为 films 最初是一个对象数组，然后它们变成了一个不可变的 Map 列表。

我应该创建不同的初始状态，还是应该使用不同类型的合并？还是别的什么？

谢谢

Answer 1

我认为你想要做的不是合并整个地图对象，至少不应该是你说的情况，应该是 update + ( concat 或 合并 ）：

const a = new Immutable.Map({
  numbers: [{id: 1},{id: 2}]
});

const b = a.update("numbers", numbers =>
  numbers.concat([{id: 4},{id: 5}])
  // or
  numbers.merge([{id: 4},{id: 5}])
);

通过在您的代码中进行合并，由于“合并”的性质，您将覆盖现有的代码，因为合并中的键是相同的； “数字”。