PureComponent的用法是不是这样

Question

一开始学习react的时候看到的是PureRenderMixin 后来google后说是用PureComponent 。我想知道什么时候用

class App extends React.Component

什么时候用

class App extends PureComponent 

这两种写法出来的组件一个样么。 还有这个PureComponent 我就这么用就可以了？不需要再写其他的代码了么

Answer 1

PureComponent的本质是帮你写了一个shouldComponentUpdate，做一层浅比较，实现渲染时优化。
如果是简单类型的比较，就不用自己写shouldComponentUpdate了。
需要注意的是：PureComponent和shouldComponentUpdate不能共存

Answer 2

简单的说就是purecomponents自己实现了shouldComponentUpdate 类似下面

function shouldComponentUpdate(nextProps, nextState){
    const cProps = this.props, cState = this.state;
    for(let key in nextProps){
        if(cProps[key] !== nextProps[key]) return true
    }
    for(let key in nextState){
        if(cState[key] !== nextState[key]) return true
    }
    
    return false;
}

Answer 3

import React from 'react';

class A extends React.Component {
    //当参数为复合数据组件时，比如对象、数组、Set、Map等， 以及它们的组件
}

class B extends React.PureComponent {
    //当参数为基本数据时使用，比如String, Number, Boolean等。
}