Create a Reducer Function for a Specific Redux Action using redux-actions
In this lesson, we’ll use the handleAction function provided by redux-actions to create a reducer function that will handle a specific action. We’ll then incorporate this reducer function into the existing reducer and ensure our application continues to function.
Instructor: [00:00] I am going to update my import for Redux Actions to import the handle action function. I am going to scroll down to the bottom of this file where reducer is.
[00:10] I am going to use handle action to create a reducer for one of our actions. I am going to start and I am going to declare the addToDo reducer. This is going to be a call to handle action, and I am going to pass in addToDo.
[00:31] My second argument is going to be a reducer function that I want to handle this action. That's going to take in state and an action, just like our reducer does. In that function, I want to return the update the state based on the action so I can just take this code right here and paste that in.
[00:58] That's going to take in the state in the action and it's going to return the new state. Just like our main reducer, it needs to take in the initial state. That's going to be passed in as the third argument. Handle action takes an action type, takes a reducer function, and it takes an initial state.
[01:21] Now, we've our reducer function with specific to the addToDo action. In order for this to handle our actions within our application though, we still need to work into our main reducer.
[01:31] What I am going to do here is I am going to replace this inline logic, and for the addToDo case, I am going to return a call to that addToDo reducer that we just created, passing through the state and the action.
[01:49] All we've done here is taking our reducer logic and move it out of our switch case statement to clean up our code a little bit. Everything still works the same. We can very that by saving this, switching to our application. When it reloads, we'll see that everything is still working as expected.
[02:07] We can make sure that refactoring that addToDo reducer logic still works by adding a new to do, and we'll see that it's still working.
[02:20] If we wanted to keep breaking this up, we could take the same approach for each one of these items creating a separate reducer and just calling it with our main reducer.
[02:30] For now, we'll just leave this as this