引出PureComponent
Component存在2个问题:
- 只要执行setState(),即使不改变状态数据, 组件也会重新render()
- 只当前组件重新render(), 就会自动重新render子组件 ==> 效率低
以上问题出现原因是
Component中的shouldComponentUpdate()总是返回true
那么
只有当组件的state或props数据发生改变时才重新render()
解决方法
办法1:
重写shouldComponentUpdate()方法
比较新旧state或props数据, 如果有变化才返回true, 如果没有返回false
办法2:
使用PureComponent
PureComponent重写了shouldComponentUpdate(), 只有state或props数据有变化才返回true
注意:
只是进行state和props数据的浅比较, 如果只是数据对象内部数据变了, 返回false
不要直接修改state数据, 而是要产生新数据
项目中一般使用PureComponent来优化