I am using Redux. Should I manage controlled input state in the Redux store or use setState at the component level?

Question

I have been trying to figure out the best way to manage my react forms. I have tried to use the onChange to fire an action and update my redux store with my form data. I have al

Answer 1

TL;DR

It's fine to use whatever as it seems fit to your app (Source: Redux docs)

---

Some common rules of thumb for determing what kind of data should be put into Redux:

• Do other parts of the application care about this data?
• Do you need to be able to create further derived data based on this original data?
• Is the same data being used to drive multiple components?
• Is there value to you in being able to restore this state to a given point in time (ie, time travel debugging)?
• Do you want to cache the data (ie, use what's in state if it's already there instead of re-requesting it)?

These questions can easily help you identify the approach that would be a better fit for your app. Here are my views and approaches I use in my apps (for forms):

Local state

• Useful when my form has no relation to other components of the UI. Just capture data from input(s) and submits. I use this most of the time for simple forms.
• I don't see much use case in time-travel debugging the input flow of my form (unless some other UI component is dependent on this).

Redux state

• Useful when the form has to update some other UI component in my app (much like two-way binding).
• I use this when my form input(s) causes some other components to render depending on what is being input by the user.