Using reducer Hooks to scale state management
The useState()
Hook is a great way to manage the state of your component. It can become a challenge to use this Hook when your component has a lot of related pieces of state. You end up with a lot of setter functions that you need to call individually, once you've figured out how a change in one state value affects another state value. With reducers, you have one dispatch()
function that's used to update the state of your component.
In this section, you'll learn about the basics of reducer actions and how they update the state of your component. Then, we'll look at a more in-depth example that shows you how to handle updating state values that depend on other state values.
Using reducer actions
A reducer function in a React application is a function that takes the current state, an action
, and any other arguments that are needed to update the state. It returns the new state of the component. The action
argument...