Original subtitles

Hi there, welcome back here in the last lecture, we have created new state in our user module.

In this lecture, we'll continue with the further improvements.

I would like to show you a new concept.

Oh, right.

Let's begin in our register page.

Let's register this view and the new concept I would like to show you is called watchers.

OK, so similar as is with the consulate properties, you can have the vouchers and you can watch for

changes of your data or you can watch for changes of the computer properties itself.

What I mean by that is let's create here some board chair under the computer that you can simply create

here in your property called the watch.

OK.

It'll be the object so that your column curly brackets.

Don't forget a comma after that.

And let's say I would like to watch the changes of my error.

What they need to do, I need to call my watcher exactly as I am calling my computer properly, so I

will carry a voucher for error.

OK, and I'll have a complete properly reacting to the state changes in our user module.

And I have a watch that's reacting to the computer properly.

So whenever the computer property changes, also, the voucher will be executed.

And in the virtual, we can get the value OK.

And I will.

In this case, I will just already doubts over the alert I'll value.

OK, so whenever I look at the error here, then we'll alert the value, that's how Voltabox, they're

reacting to the changes of the status of an able sign up in an empty forum.

You will see I will alert this error message.

So this is coming from now from the baucher.

All right.

Maybe you're asking why I will donate her need, whatever I have here copies properly and I can do the

same thing here.

I can just simply get alert and I can get it here.

But I need to get it like these, the right, sorry to hear.

Yeah, of course, you can do it this way, but there is a difference between the compute properties

and the watchers.

Compute properties are so-called a lazy.

What does it mean is that they are reacting only when the data changes?

So, for example, if I have an error, some error message that I will get the same error message that

copied properly will be not re executed.

OK, so if the data changes are the same, so I'm going from the same state to the same state that copy

properly will be not executed by the Watcher will be all the time we execute.

It doesn't matter if they're valuable changes or not.

Diversity, I will always react.

OK.

So for example, I will show that if I have an error of error message, let's say exactly like this.

I have error messages like these Firebase error.

That's my error message.

OK, if I will then blaze the registration again for, let's say, and the error will become again.

Firebase error.

OK, so the same error message.

Then the consulate properly wouldn't be called because I am going from the same state to the same state

database error, the Watcher will be not reacting to this change.

Actually, the consulate properly wouldn't be reacting to this change, OK, because copy that copy

properly are lazy.

So if the error is the same or the data are the same, then the copied properly will not react.

But the watcher would react.

So in the case you want to display some, let's say some pop up here, they will display the error message,

even though it's same as the watcher.

OK, because computers probably wouldn't be reacting again.

So that's the main difference.

And that's how you can react to the changes of your data and also to the computer.

That's properties.

I didn't show you how you can react to the changes of the data.

OK, so as a simple about how to create or react to the changes of the data should be, of course,

just create a composite property, let's say, um, let's say we'll be reacting to the changes of the

passport.

OK, so about your passport compares property passports, compared property?

We'll just simply return here.

These form dot dot passport.

OK, you like it properly, and I can react to this so-called your password, and I can in this case,

they just do not get bother with the alerts, just like your console.log and I get to hold its value

from the password to watch.

So we are watching here for this.

Copy that here.

But three right there, and they got a state for password.

So let's save it and go back to browser and you will see whenever I will be typing here.

I'll be watching.

I will be watching for this and I am displaying these and I console.

What's interesting also on board is that you can get also all to value.

Your previous value had been stored there, so I can ride here old value or previous value, and I can

get this old value.

OK, so going to get here, I'll let you see for the current and our will here, all of all four old.

And he actually called them like this and the coma and the coma, he was right there, some space between

the sea and the Oh, like this?

OK, so we'll see the old value now, but they will refresh.

I'll type in the password one, you can see current values, one old one is nothing because we didn't

have any old values that are of value.

But up here to the current value is one two.

But old value is one one two three one two three one two and so on.

So you've got a point.

That's also what you can do with what you're.

Maybe you are now wondering why I have to create our consulate property rights property for the password

and then watch for a password.

Can I watch for a nest of properties such as forum so formed with the password without creating any

computers proper?

Yeah, you can do it.

You can just enable this password.

And if anybody like to access this, you need to be very bright, the watcher.

You need to value like these need to provide a hierarchy of your nested property and here column and

the function.

Function like this.

OK, and you are watching know what NASA's property of Forum Dot password will just stuck at here.

You're watching for the forum dot password like this.

And it will work exactly the same, so you can save it.

Refresh open here.

OK, so that's working the same.

All right, guys.

That's the watchers just to recapitulate to know that the basic difference comparable properties are

lazy day who will be executed only if that data will change.

OK, but the data will change in this matter that the data will be different as the previous data,

as the new value will be, the different as the old value.

OK, the watchers are more reactive.

The watchers will be reacting always, even though the data that has changes are the same as the previous

data.

So the difference will be not using that heavily, the watchers.

But it's good to know that you have also this option.

And guys, it's going to be it.

See you in the next lecture.