React 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的条件

  1. props 和 state 必须是 immutable object
  2. props 和 state 最好不要有层级嵌套; 否则深层的数据改变不会更新组件(可以用 forceUpdate 强制更新组件)
  3. PureComponent 的子组件也应该是PureComponent

最佳食用方式

  1. Component适宜用在数据层级繁杂的地方;
  2. PureComponent适宜用在小组件中(如模态框, 错误信息展示 etc)
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章