1. Hook优缺点
优势：
- 提供组件间复用功能
- 同一业务逻辑代码相对集中
劣势：
- 没有对应getSnapshotBeforeUpdate，getDerivedStateFromError 和 componentDidCatch生命周期的Hook等价写法
2. Hook不同点
setState
- React确保setState函数的标识是稳定的，并且不会在组件重新渲染时发生变化，可以在useEffect或useCallback的依赖列表中省略setState
- setState会使用Object.is比较算法来比较state，如果相等则跳过子组件的渲染和effect的执行
- setState不会自动合并对象，需要用函数式手动合并对象
useEffect
- useEffect只会在每轮渲染后延迟执行
3. 对应关系
- constructor --- useState传入函数初始化
- componentDidMount, componentWillUnmount --- useEffect(() => {}, [])
- componentDidMount, componentDidUpdate --- useEffect
网友评论