React学习之扩展浅比较(三十四)

注意

这玩意也已经被React.PureComponent功能取代了,这里依旧是提一下(主要是React.v15的版本中的react-with-addons.js,这些玩意还存在,哎,害人呐)

引入

import shallowCompare from 'react-addons-shallow-compare' // ES6
var shallowCompare = require('react-addons-shallow-compare') // ES5 with npm
var shallowCompare = React.addons.shallowCompare; // ES5 with react-with-addons.js

1.概要

PureRenderMixin一样,如果你的React组件的渲染函数是一个纯函数也就是说对于相同的值返回一样的结果同时不影响原元素,在某些场景下,你可以利用这个插件来极大地提升性能,和前面那一篇博客一样的话,嘿嘿。

class SampleComponent extends React.Component {
  shouldComponentUpdate(nextProps,nextState) {
    return shallowCompare(this,nextProps,nextState);
  }

  render() {
    return <div className={this.props.className}>foo</div>;
  }
}

说来也只是实现了React.PuerComponent功能,或许在这个组件构建之外还有点用,然而React就是用来构造组件的。

下一篇将讲ReactLinkedStateMixin(虽然这玩意已经被弃用,有趣)

相关文章

导入moment 使用方式 年月日,时分秒 星期几 相对时间 7天后 2小时后 明天 将毫秒转换成年月日
@ 一、前言 为什么介绍redux-actions呢? 第一次见到主要是接手公司原有的项目,发现有之前的大佬在处理...
十大React Hook库 原文地址:https://dev.to/bornfightcompany/top-10-react-hook-libraries-4065 原文...
React生命周期 React的生命周期从广义上分为挂载、渲染、卸载三个阶段,在React的整个生命周期中提供很...
React虚拟DOM的理解 Virtual DOM是一棵以JavaScript对象作为基础的树,每一个节点可以将其称为VNode,用...
React中JSX的理解 JSX是快速生成react元素的一种语法,实际是React.createElement(component, props, ....