这周把手头上的某个项目用 react-redux 7.1.0 的 Hooks API 改造了下,大致的体会是:
用 Hooks 省掉了 container 的代码,dumb component 里也不会出现与 redux 相关的 props 了,不会和父组件直接传入的 props 混起来(用 TypeScript 如果直接给 container 传 props 可能会报类型不匹配的错误),代码简洁了很多。
以前可能会用 componentDidUpdate 来判断 redux store 中某个值是否变化,现在由于都改成 Functional Component 了,得用 useEffect。由于 useEffect 没有 prevProps 的参数,所以判断的逻辑需要改。
官方也提到 useSelector() 不像 connect() 那样能够在父组件 re-render 时防止子组件也一起 re-render,所以得用 React.memo()。
展开
评论