React-59:PureComponent

简介: React-59:PureComponent

React中的component存在两个问题

  • 只要执行setState(),即使不改变状态数据,组件也会重新render()
  • 当前组件重新render(),就会自动重新render子组件,如果子组件并没有用到父组件的任何东西,这样就会使得效率低。

造成上述问题的原因

  • shouldComponentUpdate()总是返回true

效率高的做法

  • 只有当组件的state或props数据发生改变时才重新render

解决问题的方法

  1. 通过手动判断shouldComponentUpdate来决定是否render

image.png

相关文章
|
1月前
|
前端开发
React Component和Purecomponent区别
React Component和Purecomponent区别
30 0
|
前端开发
react 组件进阶之 pureComponent(纯组件)
react 组件进阶之 pureComponent(纯组件)
react 组件进阶之 pureComponent(纯组件)
|
前端开发
React之PureComponent的用法
React之PureComponent的用法
101 0
|
1月前
|
设计模式 前端开发 数据可视化
【第4期】一文了解React UI 组件库
【第4期】一文了解React UI 组件库
190 0
|
1月前
|
存储 前端开发 JavaScript
【第34期】一文学会React组件传值
【第34期】一文学会React组件传值
40 0
|
1月前
|
前端开发
【第31期】一文学会用React Hooks组件编写组件
【第31期】一文学会用React Hooks组件编写组件
41 0
|
1月前
|
存储 前端开发 JavaScript
【第29期】一文学会用React类组件编写组件
【第29期】一文学会用React类组件编写组件
43 0
|
1月前
|
前端开发 开发者
【第26期】一文读懂React组件编写方式
【第26期】一文读懂React组件编写方式
37 0
|
1月前
|
资源调度 前端开发 JavaScript
React 的antd-mobile 组件库,嵌套路由
React 的antd-mobile 组件库,嵌套路由
67 0