redux-map-reducers
v1.0.1
Published
Redux reducer that maps over an object of action types
Downloads
115
Readme
redux-map-reducers
Redux reducer that maps over an object of action types.
Install
$ npm install --save redux-map-reducers
Motivation
I find switching
or if-ing
over action.type
in Redux a bit awkward and error-prone, so using a map of reducers, each one already mapped to process a specific action seems a better approach.
Docs
import { mapReducers } from 'redux-map-reducers'
mapReducers(reducerMap: Object [, initialState: Object]): Function
The mapReducers
function returns a reducer
function that processes the action being dispatched if it is one of the actions specified in the reducerMap
keys. When it finds such a key, it returns the new state, as returned by the associated reducer for that type of action. If an action of an unknown type is dispatched, the reducer created with mapReducers
will simply ignore the action since it does not know how to process it, and returns the state as received.
A slight limitation of mapReducers
is that for each reducer map you pass in, you will only have one reducer handle a certain action type. In practice, we experienced this is not so much of an issue. You can however have your main Redux reducer combine multiple mapReducers
to handle a specific action in multiple functions.
- reducerMap: Object - a map with keys being action types and values being reducer functions. When redux dispatches an action, if the action type matches one of the keys in this map, the associated reducer function returns the state.
- initialState: Object - optional. Defaults to
{}
. In redux, each reducer should return the initial/default state if the passed state is undefined.
Usage
import { createStore } from 'redux'
import { mapReducers } from 'redux-map-reducers'
const addTodo = (state, action) => {
//action.type === 'ADD_TODO'
return Object.assign({}, state, {
todos: [action.todo, ...state.todos]
})
}
const removeTodo = (state, action) => {
// ... process the state
return state
}
const toggleTodo = (state, action) => {
//...
return state
}
const initialState = { todos: [] }
const reducers = mapReducers({
'ADD_TODO': addTodo,
'REMOVE_TODO': removeTodo,
'TOGGLE_TODO': toggleTodo
}, initialState)
const store = createStore(reducers)