useReducer 不更新UI

Question

useReducer 不更新UI

我想通过 useReducer 实现一个类似官方文档中提及的 useLegacyState 的自定义hooks，来灵活更新组件中的state。

单独只使用，useState，或者 useReducer 都可以实现：
https://codesandbox.io/embed/...

但是，我使用自定义hooks却无法更新UI：
https://codesandbox.io/embed/...

这是为啥？

Answer 1

function reducer(state, action) {
  return Object.assign(state, action); // 这里state没有变化，应该返回一个新的state，React会判断前后两个state是否相等来决定是否要重新渲染
}

改为:

function reducer(state, action) {
  return Object.assign({}, state, action); 
}

欢迎关注我，和我交流