Original subtitles

I hope it's clear how to use state hook generally works.

Now, one thing which I'm not liking too much, however, is how complex it is for us to update the

state.

Of course, this is not a complex state here.

It only has two properties, only two things, title and amount.

But still, we have to ensure that when we update the title, we don't lose the old amount and when

we update the amount, we don't lose the old title.

And obviously that's doable here.

But imagine that we had a longer form here.

You would have to write a lot of code just to always save all the old state when you update something

new.

So whilst you can of course, manage state that is an object and wants this off might make sense.

You should also be aware that there is a huge important difference when you compare the state added

by you state to the state you used in Class-Based components in Class-Based components state had to

be an object and react, merged it for you automatically and functional components with U.S. state state

doesn't have to be an object and really doesn't merge it for you.

But what you can do is you can register multiple states.

So it would make much more sense here is that you don't have an object.

But let's say just a string here.

And that is your title, maybe your entered title to make it really clear what you were saying here.

And then you have to set enter title function and then we add another state here.

Which is our entered amount, and we have set entered amount here, and that's use state with an empty

string initially to.

So now I have two states which are both managed independently by react for this component, which is

stored in different variables in which it can set with different functions.

Since I don't have to manually merge anything because these are managed independently.

So I've opted one, the other one will be kept around and vice versa, because as I mentioned already,

these states survive referendum cycles, so they survive updates of other states.

But we don't have to merge manually because it's not an object anymore.

But instead we have two separate strings which were managing a state.

So now here, when we're working with the title, we could just output the entered title here and here.

We're not calling state input state, but all we're calling and it's so much easier is simply.

Set entered title, and we can pass in the new title here, however, we no longer have to store this

in a separate variable.

We don't have that closure problem anymore because there is no inner closure and dysfunction anymore.

Instead, we just call set, enter title and set this two event target value.

We don't have to manage anything, merge anything, because we managed this as two separate states.

So the same here for on change, on the amount we just call set entered amount and set this two event

target value.

It's as easy as that, and if we save this, we still have the same behavior as before, but now in

a much easier way, and this is actually my recommended way of doing this, split your state into multiple

states.

That is how you state is intended to be used and only use objects or erase as values for your state.

If you really have data that changes together or where you need to change multiple things together,

otherwise manage your state independently, it's so much easier, so much easier to write.

You don't have to merge anything manually.

It's a breeze to use it, as you can see.