注意
这玩意也已经被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
就是用来构造组件的。
下一篇将讲
React
的LinkedStateMixin
(虽然这玩意已经被弃用,有趣)