Now we are going to demonstrate a use of use contrast and use.
We'll do that together such that in every component you can do use to stage and dispatch an assembly
so you can control the content of some every components and share the Sam's state.
So back to the EP J.
We aren't going to use the use we do with her.
So we are going to import
the use we would her from we add and then we do not need the content.
Instead we are going to use another component so we can delete this one and also delete the Contra.
And now we are going to copy the initial stay and we do with her from the contra so go to the counter
and we copy and then paste inside the f j s and inside the app we are going to create a constant and
we get the stage and dispatch from the use we do that and we path the we do with her and initials day
to day use.
We do so now we go to the component folders we are going to create a computer and a lot the s
so we create a arrow Functional Component and since we are going to use a bootstrap order we have strep
we copy this or import and paste it inside the component 8 and then we save.
And back to the AB J as and now we can import the component a
form the component folder
and then we are going to create a contest such and such that we can pass the initial state and then
we are going to create a contest such that we can pass the state and also the dispatch to the components.
So we are going to edit here and we export a cornerstone the contest equal we at top create contest
if you will remember if we want to pass the contact contest we have to add the provider and then we
are going to pass the where you and the first one is the con where Leo and the other e d d patch which
is this one actually you can also pass it using another name but since we are going to pass the same
name and for the simplicity we can it is one and just leave the dispatch here it is actually the same
as its patch semicolon dispatch now we can go to the component a and we are going to import the contest
from the EP so you're to use the contact contest we are going to add the cornerstone and counter contest
which is equal to use contest and contact contest but we have an import the youth contest so we have
to import from here
so we can console law the kind of contest to see what inside the contact contest.
So if we take a look on this object.
Actually there are two properties.
One is contour.
And one is dispatch so we can use the AP constructor ring to get these two values.
Now we can go to the contour.
Actually this file will be deleted but since some copy still you are going to use we have to copy from
here.
So we copy it is not in groups
and replace it here.
And you already see there is no dispatch.
So we have to change the name from this patch one to this patch only.
And actually we do not need the other button groups and we just need one contour here and we can say
this is a component a condo counter
and you already see there's no state one here because the value already can be get from the contact
as you can see the contralto is stored inside the content.
And now you can also add the radicals and also decrease the radio.
And also we said the value.
We can also compare we've to contact inside the app J as we can also add the Canto value here.
Now we back to our website you'll see the empty contact.
And I can put an a counter where we passed a button inside the computer an A.
Both of them can be controlled by these buttons.
So this is how to use the use we do sir and use contest together.