React：Using shouldComponentUpdate

shouldComponentUpdate

若person的上层re-render，则person也会被re-render； 所以需要对子类使用条件判断，不re-render与自己无关的事件；

shouldComponentUpdate(nextProps,nextState){ if(nextProps.persons !== this.props.persons){ console.log('[Persons.js] shouldComponentUpdate'); return true; } return false; }

注意点： persons为array的比较，及指针地址的比较； 若更改为浅拷贝，则地址不会改变，永远不变； 所以需要使用深拷贝——persons1=[…persons2]；

Funtional

export default React.memo(Cockpit);

若是经常需要随上层改变的，无需设置shouldComponendUpdate

会减慢速度——增加无效判断；

PureComponent

import React,{PureComponent} from 'react'; class Persons extends PureComponent{

会自动填补需要更新的内容，若无则不re-render；