Skip to content

React.PureComponent 和 React.Component 有什么区别?

Posted on:2024年8月10日 at 17:04

PureComponent 和 Component的区别是:Component需要手动实现 shouldComponentUpdate,而 PureComponent 通过浅对比默认实现了 shouldComponentUpdate 方法。

浅比较(shallowEqual),即react源码中的一个函数,然后根据下面的方法进行是不是PureComponent的判断,帮我们做了本来应该我们在 shouldComponentUpdate 中做的事情

if (this._compositeType === CompositeTypes.PureClass) {
  shouldUpdate =
    !shallowEqual(prevProps, nextProps) || !shallowEqual(inst.state, nextState);
}

注意: 浅比较只比较了第一层,复杂数据结构可能会导致更新问题

总结: PureComponent 不仅会影响本身,而且会影响子组件,所以 PureComponent 最佳情况是展示组件

原文转自:https://fe.ecool.fun/topic/ce52c8e9-5835-4021-ba1c-1cda46ba1578