javascript - 在 React 中将 shouldcomponentupdate 转换为备忘录

Question

使用 React 备忘录的等效代码是什么？

 shouldComponentUpdate(nextProps) {

    if (this.props.addCourse !== nextProps.addCourse || this.props.level !== nextProps.level ) {
      return true;
    } else {
      return false;
    }
  }

标签： javascriptreactjsreact-usememo

Answer 1

memo高阶组件使用一个额外的函数，该areEqual函数应该返回shouldComponentUpdate.

备忘录

笔记

与shouldComponentUpdate()类组件上的方法 不同，如果 props 相等或者props 不相等，areEqual函数会返回 。这是 的倒数 。truefalseshouldComponentUpdate

const areEqual = (prevProps, nextProps) => {
  if (
    prevProps.addCourse !== nextProps.addCourse ||
    prevProps.level !== nextProps.level
  ) {
    return false;
  }
  return true;
};

memo(MyComponent, areEqual);