redux-actions
Search…
handleAction(s)
Methods
handleAction
1
handleAction(
2
type,
3
reducer | reducerMap = Identity,
4
defaultState,
5
)
Copied!
1
import { handleAction } from 'redux-actions';
Copied!
handleAction(type, reducer, defaultState)
handleAction(type, reducer, defaultState)If a
reducer function is passed, it is used to handle both normal actions and failed actions. (A failed action is analogous to a rejected promise.) You can use this form if you know a certain type of action will never fail, like the increment example above.If the reducer argument (
reducer) is undefined, then the identity function is used.The third parameter
defaultState is required, and is used when undefined is passed to the reducer.EXAMPLE
1
handleAction(
2
'APP/COUNTER/INCREMENT',
3
(state, action) => ({
4
counter: state.counter + action.payload.amount
5
}),
6
defaultState
7
);
Copied!
handleAction(type, reducerMap, defaultState)
handleAction(type, reducerMap, defaultState)Otherwise, you can specify separate reducers for
next() and throw() using the reducerMap form. This API is inspired by the ES6 generator interface.If the reducer argument (
reducerMap) is undefined, then the identity function is used.EXAMPLE
1
handleAction('FETCH_DATA', {
2
next(state, action) {...},
3
throw(state, action) {...},
4
}, defaultState);
Copied!
If either
next() or throw() are undefined or null, then the identity function is used for that reducer.handleActions
1
handleActions(reducerMap, defaultState);
Copied!
Creates multiple reducers using
handleAction() and combines them into a single reducer that handles multiple actions. Accepts a map where the keys are passed as the first parameter to handleAction() (the action type), and the values are passed as the second parameter (either a reducer or reducer map). The map must not be empty.If
reducerMap has a recursive structure, its leaves are used as reducers, and the action type for each leaf is the path to that leaf. If a node's only children are next() and throw(), the node will be treated as a reducer. If the leaf is undefined or null, the identity function is used as the reducer. Otherwise, the leaf should be the reducer function.1
import { handleActions } from 'redux-actions';
Copied!
handleActions(reducerMap, defaultState[, options])
handleActions(reducerMap, defaultState[, options])The second parameter
defaultState is required, and is used when undefined is passed to the reducer.(Internally,
handleActions() works by applying multiple reducers in sequence using reduce-reducers.)EXAMPLE
1
const reducer = handleActions(
2
{
3
INCREMENT: (state, action) => ({
4
counter: state.counter + action.payload
5
}),
6
7
DECREMENT: (state, action) => ({
8
counter: state.counter - action.payload
9
})
10
},
11
{ counter: 0 }
12
);
Copied!
Or using a JavaScript
Map type:1
const reducer = handleActions(
2
new Map([
3
[
4
INCREMENT,
5
(state, action) => ({
6
counter: state.counter + action.payload
7
})
8
],
9
10
[
11
DECREMENT,
12
(state, action) => ({
13
counter: state.counter - action.payload
14
})
15
]
16
]),
17
{ counter: 0 }
18
);
Copied!
You can also use an action function as the key to a reduce function instead of using a string const:
1
const increment = createAction(INCREMENT);
2
const decrement = createAction(DECREMENT);
3
4
const reducer = handleActions(
5
new Map([
6
[
7
increment,
8
(state, action) => ({
9
counter: state.counter + action.payload
10
})
11
],
12
13
[
14
decrement,
15
(state, action) => ({
16
counter: state.counter - action.payload
17
})
18
]
19
]),
20
{ counter: 0 }
21
);
Copied!
handleActions(actionMap[, defaultState], options)
handleActions(actionMap[, defaultState], options)You can prefix each action type by passing a configuration object as the last argument of
handleActions.EXAMPLE
1
const options = {
2
prefix: 'counter', // String used to prefix each type
3
namespace: '--' // Separator between prefix and type. Default: `/`
4
}
5
6
createActions({ ... }, 'INCREMENT', options)
7
8
handleActions({ ... }, defaultState, options)
Copied!
Last modified 2yr ago
Copy link