Hello, in this video, I am going to show you the switch component. So the switch component essentially allow it basically a toggle, essentially. And you've seen on applications, you know, all the time, just to know the switch itself doesn't maintain any particular state. When you change what looks like the state from, you know, on 12th off to one, it basically has a method called unchanged, which is a required method that you need to implement. And we'll do that in a second. And that allows you to detect what's been changed but on its own doesn't maintain the state, we have to actually handle that.

So to creditors, which is which correctly, obviously, and then inside of here, there's two, you know, required parameter. value, which is, whether it's on or off, you know, by default false is all on is true or true. And then next is on change. And this is just a nerd function and in here. Okay, so let's save that. And let's see what we get.

So it's just hot reload in, and we got this little thinking. So if I click it, we can obviously, you know, slide in like so. And at the moment, if you notice, it's constantly just true. So we need to, you know, essentially have a way of handling that. And we need to basically set the state. So we add side of the equation variable, want to create a variable, I need the counter.

I'm gonna say boy, oh, J equals false by default. And this will be we'll change this to that. So if we change that to true, it will be on by default. Let me do that. Don't read any of this. It's true, that's true.

So you look slightly different. And in here, all you do is set state. Inside of here, we want to say, state. All, I'll rename this to F, I'm gonna say state because and now if we want to run, and let's do a print out as well. So when state, and obviously, we can use this state variable outside of the actual switch itself. So maybe we're on a second page, we're talking stuff on and off, maybe notifications, that sort of stuff.

And once we click save, he could use this variable, you know, variables like this for multiple switches, and then save it accordingly. So if I save that thought reloaded By default it is on. If I click it in now actually toggles on and off. Instead of me having to slide it now it's false. Click it again, it is true. Click it again, it is false.

Click it again, it is true. And obviously the sliding mechanism will work as well as if you want to go down that route for switches, that's really all there is to it. These are the main two things that need make sure, generally speaking, this is the same as mine, and that you have this really variable state there are other property that you can modify like you know the color if you want to have a form now image, you know, the inactive color, all of that stuff. As an extra test. I want you to experiment with these other extra aesthetic properties. That's it.

If you have any questions, feel free to drop me a message. And as usual, I look forward to seeing you in the next video.