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)
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章