在React中将shouldcomponentupdate转换为备忘录

Question

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

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

Answer 1

memo高阶组件使用额外的areEqual函数，该函数应返回shouldComponentUpdate的逆。

备忘录

注意

与类组件上的shouldComponentUpdate()方法不同如果props相等，则areEqual函数返回true，并且false如果道具不相等。这与shouldComponentUpdate。

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