React 中的 Component、PureComponent、无状态组件 之间的比较
- React 中的 Component、PureComponent、无状态组件之间的比较
组件类型 | 说明 |
---|---|
React.createClass | 不使用ES6语法,只能使用 React.createClass 来创建组件;React对属性中的所有函数都进行了this绑定 |
Component | 使用ES6语法创建组件;React并没有对内部的函数,进行this绑定 |
PureComponent | shouldComponentUpdate通过判断props和state是否发生变化来决定需不需要重新渲染组件,当然有时候这种简单的判断,显得有些多余和样板化,于是React就提供了PureComponent来自动帮我们做这件事,这样就不需要手动来写shouldComponentUpdate了。注意:PureComponent 自动为我们添加的shouldComponentUpate函数,只是对props和state进行浅比较;最简单避免上述情况的方式,就是避免使用可变对象作为props和state,取而代之的是每次返回一个全新的对象;也可以考虑使用Immutable.js来创建不可变对象,通过它来简化对象比较,提高性能。 |
无状态组件 | 无state,只有props。 |
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步