1

I have a form with 30 fields and all those fields are a template from a value in a dropdown, if I change the value of the template I will end up creating a custom template.

So the action is:

  • When we are changing a value from the form, the template will change in custom template

As you can see there are some logic that come up and down and I'm worried about the multiple setState declaration and call. Should I use useReducer or useState?

lifeisfoo
  • 15,478
  • 6
  • 74
  • 115
Robert
  • 554
  • 5
  • 13
  • When you have several states changing at the same time locally on the same component useReducer is cleaner and preferred above useState. Can you please share some code so I can help further. – BoyePanthera Nov 21 '20 at 11:22

1 Answers1

3

From the useReducer documentation:

useReducer is usually preferable to useState when you have complex state logic that involves multiple sub-values or when the next state depends on the previous one.

You should use the useReducer to manage you complex form, otherwise you'll end up having many useState and a many useEffects to update every other state when one of those useState changes. In this case useReducer is definetevely the best option.

In this way all your UI elements will be a visual representation of the useReducer state, so any value change in a field must trigger an action to update the state and then the UI.

You can also try using an existing library like react-hook-form, but this choise is up to you and depends on your requirements.

lifeisfoo
  • 15,478
  • 6
  • 74
  • 115