PureComponent 和 Component
react
区别
PureComponent 是浅比较, 如五种基础类型(boolean, string, number, null, undifined)基础类型:直接比较;
而引用类型(如数组arrTemp=[1, 2, 3, 4]): 更新后, arrTemp为[1, 3, 4], 此时PureComponent 认为arrTemp的引用地址没有变化(可以通过JSON.parse(JSON.stringify(arrTemp)) 或者 解构 来避免), 不会触发更新操作
总而言之, PureComponent是通过弱化前后props的比较来提升性能
使用PureComponent的条件
- props 和 state 必须是 immutable object
- props 和 state 最好不要有层级嵌套; 否则深层的数据改变不会更新组件(可以用 forceUpdate 强制更新组件)
- PureComponent 的子组件也应该是PureComponent
最佳食用方式
- Component适宜用在数据层级繁杂的地方;
- PureComponent适宜用在小组件中(如模态框, 错误信息展示 etc)