combineActions

Last updated 4 months ago

Methods

combineActions

combineActions(...types);

Combine any number of action types or action creators. types is a list of positional arguments which can be action type strings, symbols, or action creators.

import { combineActions } from 'redux-actions';

combineActions(...types)

This allows you to reduce multiple distinct actions with the same reducer.

const { increment, decrement } = createActions({
INCREMENT: amount => ({ amount }),
DECREMENT: amount => ({ amount: -amount }),
})
const reducer = handleAction(combineActions(increment, decrement), {
next: (state, { payload: { amount } }) => ({ ...state, counter: state.counter + amount }),
throw: state => ({ ...state, counter: 0 }),
}, { counter: 10 })
expect(reducer(undefined, increment(1)).to.deep.equal({ counter: 11 })
expect(reducer(undefined, decrement(1)).to.deep.equal({ counter: 9 })
expect(reducer(undefined, increment(new Error)).to.deep.equal({ counter: 0 })
expect(reducer(undefined, decrement(new Error)).to.deep.equal({ counter: 0 })

Below is how you would use combineActions and handleActions together

EXAMPLE

const { increment, decrement } = createActions({
INCREMENT: amount => ({ amount }),
DECREMENT: amount => ({ amount: -amount })
});
const reducer = handleActions(
{
[combineActions(increment, decrement)]: (
state,
{ payload: { amount } }
) => {
return { ...state, counter: state.counter + amount };
}
},
{ counter: 10 }
);
expect(reducer({ counter: 5 }, increment(5))).to.deep.equal({ counter: 10 });
expect(reducer({ counter: 5 }, decrement(5))).to.deep.equal({ counter: 0 });
expect(reducer({ counter: 5 }, { type: 'NOT_TYPE', payload: 1000 })).to.equal({
counter: 5
});
expect(reducer(undefined, increment(5))).to.deep.equal({ counter: 15 });