DEV Community

Discussion on: How to use useReducer hook to mimic setState method?

Collapse
 
alfredosalzillo profile image
Alfredo Salzillo

The more you have to remember and do manually the bigger possibiity of bug (to say nothing about how tedious it might be). >

In your example, if you add another property, for example, the 'Middle Name', you have to add a row in either the cases (using multiple set or a setState).
The number of things to remember is the same, so the 'possibility' of a mistake is the same.

Thread Thread
 
przemwo profile image
Przemek Wolnik

@alfredosalzillo yes but having them groupped in one object means: they are connected to each other.

const [formData, setFormData] = useReducer(reducer, {
  name: 'Bob',
  surname: 'Smith',
  password: 'pass',
  age: 18,
});
const [someOtherVar, setSomeOtherVar] = useState(125);

This way I don't have to remember which state variables should be changed. I can take a look at initial formData object and see all properties that need to be reset.

Thread Thread
 
dericgw profile image
Deric Cain

I totally agree with you. For instance, say you have a form with a few inputs. When you go to submit that form, if you are using useState, then you have to create an object with all of the fields in order to submit the data. Sure... no big deal, but when using useReducer, you simply submit your state because it is already an object.

Anyone saying that you are "doing it wrong" is, well.... wrong. There is no rule that says you can't use useReducer just like you are using it in this example. I actually prefer it and if it works easier for you, then "you are doing it right" (especially since there are no perf hits and nothing wrong syntactically).