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)
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值