React ——有关 Component 的相关知识
作者:
定格r | 来源:发表于
2019-08-08 10:49 被阅读0次
- Component存在的问题?
1). 父组件重新 render(), 当前组件也会重新执行render(), 即使没有任何变化
2). 当前组件setState(), 重新执行render(), 即使state没有任何变化
- 解决Component存在的问题
1). 原因: 组件的componentShouldUpdate()
默认返回true, 即使数据没有变化render()都会重新执行
2). 办法1: 重写shouldComponentUpdate(), 判断如果数据有变化返回true, 否则返回false
3). 办法2: 使用PureComponent代替Component
4). 说明: 一般都使用PureComponent来优化组件性能
-
PureComponent
的基本原理
1). 重写实现shouldComponentUpdate()
2). 对组件的新/旧state和props中的数据进行浅比较, 如果都没有变化, 返回false, 否则返回true
3). 一旦componentShouldUpdate()
返回false不再执行用于更新的render()
- 面试题:
组件的哪个生命周期勾子能实现组件优化?
PureComponent的原理?
区别Component与PureComponent?
本文标题:React ——有关 Component 的相关知识
本文链接:https://www.haomeiwen.com/subject/bsbtjctx.html
网友评论