Last active
April 22, 2016 10:49
-
-
Save PCreations/aa6895560dbaae961d81eafec3d5bba7 to your computer and use it in GitHub Desktop.
Pure immutable render decorator for react pure component. Param propsToRemove is intended to be a list of keys you want to remove from props before performing the Immutablity check (typically removing the callback keys).
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react' | |
import Immutable from 'immutable'; | |
const pureComponent = (Component, propsToRemove = []) => { | |
class PureComponent extends React.Component { | |
constructor(props) { | |
super(props); | |
this.displayName = 'PureComponent'; | |
} | |
comparator(props, nextProps, state, nextState) { | |
return ( | |
!Immutable.is(Immutable.fromJS(props), Immutable.fromJS(nextProps)) || | |
!Immutable.is(Immutable.fromJS(state), Immutable.fromJS(nextState)) | |
) | |
} | |
removeKeysFromObject(obj, keys) { | |
var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; | |
} | |
shouldComponentUpdate(nextProps, nextState) { | |
let propsToCompare = this.removeKeysFromObject(this.props, propsToRemove), | |
nextPropsToCompare = this.removeKeysFromObject(nextProps, propsToRemove); | |
return this.comparator(propsToCompare, nextPropsToCompare, this.state, nextState) | |
} | |
render() { | |
return <Component {...this.props} {...this.state} /> | |
} | |
} | |
return PureComponent; | |
} | |
export default pureComponent; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment