javascript - 使用 Redux 替换 reducer 中的整个状态

Question

标题听起来有道理，但如果我从服务器和 reducer 中收集数据会发生什么，我只想返回这些数据并将它们设置为新状态。

例如从后端获取数据。如果我想像这样替换它，我真的需要复制以前的状态吗:

export function accountData(state = [], action) {
  switch (action.type) {
    case FETCH_FAILURE:
      console.error('SOMETHING BAD JUST HAPPENED');
      break;
    case FETCH_SUCCESS:
        return Object.assign([], state, action.accountData);
    default:
      return state;
  }
}

或者在这种情况下这样做是否可以:

export function accountData(state = [], action) {
      switch (action.type) {
        case FETCH_FAILURE:
          console.error('SOMETHING BAD JUST HAPPENED');
          break;
        case FETCH_SUCCESS:
            return action.accountData;
        default:
          return state;
      }
    }

Answer 1

是的，您可以替换整个状态。* Object.assign 只是一种替换部分状态的便捷方法，同时保留其他所有状态，并且以不可变的方式进行。如果您要替换整个状态，则无需使用 Object.assign。

(*当我说状态时，我指的是 reducer 负责的状态部分。)

此外，对数组使用 Object.assign 毫无意义。 Object.assign([], state, action.accountData); 在语义上等同于 Object.assign([], action.accountData); 也就是说，它创建了数组的新副本。但是因为它是一个数组而不是一个对象，一个更明确和直观的写法是 action.accountData.slice(0) 或 [...action.accountData]. [更正:事实上，Object.assign 对数组进行索引替换，这几乎肯定不是您想要的。]

只要你把数组当作只读的，你就可以直接返回数组而不用复制它。所以您编写它的最后一种方式 - return action.accountData; - 是完全正确的。

最后，我必须对 FETCH_FAILURE 案例提出异议。您不会为此操作返回任何内容。但是你的 reducer 应该总是返回一些东西。而不是 break; 你可能应该有 return state; 或 return []; 取决于你想如何处理失败案例。