Redux Reducers in Depth

December 29, 2019

createReducer()

code

createReducer(initialState, {
  // object mapping action types to 'case' reducers
});

code

const counterReducer = createReducer(0, {
  increment: (state, action) => state + action.payload,
  decrement: (state, action) => state - action.payload,
});

code

// Actions creators generated by createAction
const increment = createAction("increment");
const decrement = createAction("decrement");

const counterReducer = createReducer(0, {
  [increment]: (state, action) => state + action.payload, // reference generated action creator as a computed property
  [decrement.type]: (state, action) => state - action.payload, // Typescript may want [action.type] to force compiler to compute property
});

[increment] = computed property syntax (allows you to put an expression in brackets [])
Both [increment] and [increment.type] will work.