combineActions

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 });

Last updated