重点待学习:
1.使用自定义hook,render props,高阶组件实现逻辑复用
2. hook中使用useReducer和react-redux
3. 其他hook api的使用
4. 学习hooks的性能优化
setState推荐用法:setCount(c => c +1);
useReducer使用场景:
当state 逻辑较复杂且包含多个子值,或者下一个 state 依赖于之前的 state 等。并且,使用 useReducer
还能给那些会触发深更新的组件做性能优化,因为你可以向子组件传递 dispatch
而不是回调函数 。
推荐的修复方案是把那个函数移动到你的 effect 内部。这样它就不用出现在它的依赖列表中了,而且能很容易的看出来你的 effect 使用了哪些 props 和 state,并确保它们都被声明了:
组件之间复用状态逻辑:render props方法和高阶组件以及自定义hooks
忘记正确地处理 componentDidUpdate
是 React 应用中常见的 bug 来源。试例:https://zh-hans.reactjs.org/docs/hooks-effect.html#tip-use-multiple-effects-to-separate-concerns
使用多个useEffect实现关注点分离:相同逻辑放在同一个useEffect