React.memo； react.memo 与useMemo区别

React.memo

React.memo介绍

• React.memo()是一个高阶组件
• 如果你的组件在相同 props 的情况下渲染相同的结果，那么你可以通过将其包装在 React.memo 中调用，以此通过记忆组件渲染结果的方式来提高组件的性能表现。这意味着在这种情况下，React 将跳过渲染组件的操作并直接复用最近一次渲染的结果。
• React.memo 仅检查 props 变更。如果函数组件被 React.memo 包裹，且其实现中拥有 useState，useReducer 或 useContext 的 Hook，当 state 或 context 发生变化时，它仍会重新渲染。
• 默认情况下其只会对复杂对象做浅层对比，如果你想要控制对比过程，那么请将自定义的比较函数通过第二个参数传入来实现。
• 用于性能优化，但请不要依赖它来“阻止”渲染，因为这会产生 bug。
• 只能在函数式组件中使用；类似于类组件中的（PureCompoment,shouldComponentupdate）
• react.memo中文文档

React.memo简单理解

• 高阶组件；用于性能优化；函数式组件中使用；通过比较props,如果props有变化则重新渲染组件，没有变化则不执行js不渲染，目的是为了阻止子组件被动渲染。

React.memo用法

• React.memo()可接受2个参数；
• 第一个参数是性能优化的目标组件；
• 第二个参数是比较函数，与shouldComponentUpdate()功能类似；

const ChildComponent = (props) =>{
   
  /* render using props */
}
const areEqual = (preProps,nextProps) => {
   
  /*如果把 nextProps 传入 render 方法的返回结果与
  将 prevProps 传入 render 方法的返回结果一致则返回 true，
  否则返回 false */
}
export