Connect a pure-flux store to React.js.
It enables the PureRenderMixin to improve performance.
npm install --save react-pure-flux pure-flux
var Component = require('react').Component;
var {createStore, dispatch} = require('pure-flux');
var {connectStore} = require('react-pure-flux');
var countStore = createStore("CounterStore", (state={ count: 0 }, action) => {
switch (action.type) {
case 'increment':
return { count: state.count+1 };
default:
return state;
}
});
class MyComponent extends Component {
handleUpClick() {
dispatch('increment')
}
handleDownClick() {
dispatch('decrement')
}
render() {
return (
<div>
<p>{this.props.count}</p>
<button onClick={this.handleUpClick}>+1</button>
<button onClick={this.handleDownClick}>-1</button>
</div>
);
}
});
EnhancedComponent = connectStore(countStore, MyComponent, (state) => {
count: state
})