Question

Redux中reducer的一条规则是：我们应该将状态视为只读，并返回一个新对象作为新状态。

但是有一个灰色区域：必须严格返回一个新对象作为状态，还是我们可以返回相同的状态对象？

通过查看通用代码，例如：

function favoriteColors(state, action) {
  if (state === undefined) {
    state = [];
  }

  if (action.type === 'ADD') {
    return Array.from(new Set([...state, action.color]));  // new array
  } else if (action.type === 'REMOVE') {
    return state.filter(color => color !== action.color);  // new array
  } else {
    return state;
  }
}

当action.type未知时，将返回相同的状态对象。因此，规则是reducer不必严格返回新的状态对象，而可以返回相同的状态对象。但是严格的规则是状态必须是只读的？

Answer 1

规则是您不得变异一个状态对象，因为这可能会破坏代码中其他地方的假设。可以返回相同的状态对象。

function goodReducer(state, action) {
  return state;
}

function badReducer(state, action) {
  state.counter = (state.counter || 0) + 1;
  return state;
}

这样做的原因是为了确保渲染的DOM是正确的和最新的，对状态的更新必须流经调度程序。

尤其是：

在不受控制的情况下更改对象会使缓存（例如shouldComponentUpdate）无效
更改对象可能导致呈现不一致的状态（例如，如果突变发生在render期间）

返回未修改的状态就可以了。实际上，像Immutable.js这样的库通常会这样做。

Redux中的reducer是否必须严格返回新的状态对象？

1 个答案: