Search code examples
reactjsreduxdispatchreducers

Redux - relation of reducers to actions


I am new to react/redux. I am trying to figure out how all the pieces in redux interact. The one thing giving me trouble is understanding the relation between actions and reducers. When an action is called, how does the store know which reducer to use? Does it base it completely on the action type name? Do type names have to be unique? To whom or what does the reducer pass the new state object to, the store or the action?

As I understand it, it goes like this:

  1. store.dispatch(action) is called
  2. store finds the related reducer based on action type
  3. Reducer clones the current state object, makes the changes, passes it back (somewhere)

Solution

  • 1: how does the store know which reducer to use -> This is based entirely on the action type.

    2: Do type names have to be unique? -> This is not a rule. But mostly, yes. Each action has a distinct type name and the corresponding reducer gets invoked.

    3: To whom or what does the reducer pass the new state object to, the store or the action? -> The reducer does not pass the new state object anywhere. Basically, it triggers a state change event to all your react components that are listening to it. All components listening to the changed state get re-rendered, with the new version of the state, thereby updating your DOM.