A utility to wrap many copies of a single Redux reducer into a single key-based reducer.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
docs make a export at index for wrapAction and update the docs/Api.md (#122) Jan 23, 2017
src make a export at index for wrapAction and update the docs/Api.md (#122) Jan 23, 2017
test make a export at index for wrapAction and update the docs/Api.md (#122) Jan 23, 2017
.babelrc cleanup dependencies Jul 2, 2016
.eslintignore initial commit. v1.0.0 Sep 28, 2015
.eslintrc
.gitignore Ignore yarn.lock Jan 23, 2017
.npmignore spaces Jan 25, 2016
.travis.yml test against node 5 and 6 Jul 2, 2016
LICENSE
README.md move usage and api documentation to separate file Jul 5, 2016
immutable.js Add immutable support Jul 2, 2016
package.json
webpack.config.base.js
webpack.config.development.js initial commit. v1.0.0 Sep 28, 2015
webpack.config.production.js initial commit. v1.0.0 Sep 28, 2015

README.md

multireducer

NPM Version NPM Downloads Build Status

multireducer is a utility to wrap many copies of a single Redux reducer into a single key-based reducer.

Installation

npm install --save multireducer

Why?

There are times when writing a Redux application where you might find yourself needing multiple copies of the same reducer. For example, you might need more than one list of the same type of object to be displayed. Rather than make a big reducer to handle list A, B, and C, and have action creators either in the form addToB(item) or addToList('B', item), it would be easier to write one "list" reducer, which is easier to write, reason about, and test, with a simpler add(item) API.

However, Redux won't let you do this:

import list from './reducers/list';

const reducer = combineReducers({
  a: list,		// WRONG
  b: list,		// WRONG
  c: list		// WRONG
});

Each of those reducers is going to respond the same to every action.

This is where multireducer comes in. Multireducer lets you mount the same reducer any number of times in your Redux state tree, as long as you pass the key that you mounted it on to your connected component.

Read the full API Documentation

Working Example

The react-redux-universal-hot-example project uses multireducer. See its reducer.js, which combines the plain vanilla counter.js duck, to a multireducer. The CounterButton.js connects to the multireducer, and the Home.js calls <CounterButton/> with a multireducerKey prop.

Example with multiple counters and ducks composition.