v3.0.0-beta2
Pre-release
Pre-release
This is a whole new rewrite version.
Breaking changes
connectMultireducer
has been removed, you can usereact-redux
'sconnect
directly.multireducerBindActionCreators
has been renamed tobindActionCreators
.
Migration Guide
Version 2
import React, { Component, PropTypes } from 'react';
import { connectMultireducer } from 'multireducer';
import { add, remove } from './actions/list';
const mapStateToProps = (key, state) => ({ list: state.listCollection[key] });
const mapDispatchToProps = {add, remove};
ListComponent = connectMultireducer(
mapStateToProps,
mapDispatchToProps
)(ListComponent);
export default ListComponent;
render() {
return (
<div>
<h1>Lists</h1>
<ListComponent multireducerKey="proposed"/>
<ListComponent multireducerKey="scheduled"/>
<ListComponent multireducerKey="active"/>
<ListComponent multireducerKey="complete"/>
</div>
);
}
Version 3
import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux'; // <= use react-redux's connect directly
import { bindActionCreators } from 'multireducer'; // <= use multireducer's version of bindActionCreators
import { add, remove } from './actions/list';
const mapStateToProps = (state, { as }) => ({ list: state.listCollection[as] }); // <= access state by multireducer key
const mapDispatchToProps = (dispatch, { as }) => bindActionCreators({ add, remove }, dispatch, as); // <= pass multireducer key to bindActionCreators
ListComponent = connectMultireducer(
mapStateToProps,
mapDispatchToProps
)(ListComponent);
export default ListComponent;
render() {
return (
<div>
<h1>Lists</h1>
{/* you can name the multireducer key whatever you want, it's 'as' in this example */}
<ListComponent as="proposed"/>
<ListComponent as="scheduled"/>
<ListComponent as="active"/>
<ListComponent as="complete"/>
</div>
);
}