Redux 意外行为 |如果找不到则创建空对象答案

【问题标题】：Redux unexpected behaviour | create empty object if not foundRedux 意外行为 |如果找不到则创建空对象
【发布时间】：2021-07-09 11:48:48
【问题描述】：

我正在调试一个应用程序，有一个现有的 redux reducer 可以设置 store 对象的一些数据。现在，当我在相关对象初始化之前为该减速器调度操作时，它仍然可以工作并创建一个空对象。这适用于我们的部署服务器，并在我的本地机器上崩溃，并出现“map is undefined on null”的正确错误。为什么它创建一个空对象并且没有在部署服务器上崩溃，如果它正在创建一个对象，为什么它没有分配我们传递给它的数据。我的减速机是

 case ACTIONS.SET_LOCAL_WEIGHTS: {
      const { weight } = action;
      const drafts = fromJS(state.getIn(['draftData', 'rows']));
      const setWeight = drafts.map((row: any) => {
        row.data.weight = weight[row.id].weight;
        return row;
      });

      return state
        .setIn(['draftData', 'rows'], setWeight)
        .setIn(['draftData', 'total'], setWeight.length);
    }

它创建：draftData: {} 当还提供行和总计时。我已经在节点 15 和 12 上尝试过检查地图功能上的任何异常。

【问题讨论】：

我正在添加 immutable.js 标记，因为这似乎是一个特定于不可变的问题。老实说，我对代码感到困惑，但我对不可变并不十分熟悉。

标签： node.js redux immutable.js

【解决方案1】：

如果初始状态没有属性state.draftData.rows，我会在您的代码中收到错误Cannot read property 'map' of undefined。我看不到您将创建空对象的任何地方。

如果使用来自state.draftData.rows 的array 调用，immutable.js fromJS method 将创建一个List。但如果使用undefined 调用它，那么它会返回undefined，而不是使用.map() 方法的集合。

如果rows 对象从未转换toJS，我也不认为您需要调用fromJS，但这可能取决于您的初始状态。

这段代码应该可以工作。它使用来自state 的现有List（如果存在），否则创建一个空的List。

const drafts = state.getIn(["draftData", "rows"]) ?? fromJS([]);

row.data.weight = weight[row.id].weight 中的赋值似乎是状态的突变。

我试图重写它，但我觉得奇怪的是，除非它们的索引/键与已经处于状态的索引/键匹配，否则您的代码不会对有效负载中的权重做任何事情。

import { fromJS, List, Map } from "immutable";

interface Row {
  data: {
    weight: number;
  };
  id: number;
}

const reducer = (state = Map(), action) => {
  switch (action.type) {
    case ACTIONS.SET_LOCAL_WEIGHTS: {
      const { weight } = action;

      const drafts: List<Row> =
        state.getIn(["draftData", "rows"]) ?? fromJS([]);
      const setWeight = drafts.reduce(
        (next, row, index) =>
          next.setIn([index, "data", "weight"], weight[row.id]?.weight),
        drafts
      );

      return state
        .setIn(["draftData", "rows"], setWeight)
        .setIn(["draftData", "total"], setWeight.size);
    }
    default:
      return state;
  }
};

【讨论】：