memo 和 useMemo 和 useCallback 的区别
相同点:
- 它们都可以用来缓存数据,避免子组件的无效重复渲染。
不同点:
- React.memo 是一个高阶组件,useMemo 是一个 hook。
联系:
- 当我们的父子组件之间不需要传值通信时,可以选择用 React.memo 来避免子组件的无效重复渲染。
- 但我们的父子组件之间需要进行传值通信时,React.memo 和 useMemo 都可以使用。
- 但我们的父子组件之间需要进行函数通信时,可以选择用 useCallback 来避免子组件的无效重复渲染。
- useCallback 必须配合 memo 使用,memo 负责浅比较,useCallback 负责自定义比较
不足:
- useEffect、useMemo、useCallback 反映的是当前的状态,无法使用它们来捕获上一次的状态。对于这种情况,我们应该使用 ref 来访问。