0% found this document useful (0 votes)
7 views

FSD Module 5 React JS Part 11

Uploaded by

245121733078
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views

FSD Module 5 React JS Part 11

Uploaded by

245121733078
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

ReactJS | forms

Forms are really important in any website for login, signup, or whatever.

It is easy to make a form but forms in React work a little differently.

If you make a simple form in React it works, but it’s good to add some JavaScript code
to our form so that it can handle the form submission and retrieve data that the user
entered.

To do this we use controlled components.

This video is a sole property of Talent Battle Pvt. Ltd. Strict Penal Action will be taken against unauthorized piracy of this video
Controlled Components:

In simple HTML elements like input tag, the value of the input field is changed
whenever the user type.

But, In React, whatever the value user types we save it in state and pass the same
value to the input tag as its value, so here its value is not changed by DOM, it is
controlled by react state.

Implementation………..

This video is a sole property of Talent Battle Pvt. Ltd. Strict Penal Action will be taken against unauthorized piracy of this video
Functional components lack a significant amount of features as compared to class-based
components.

The gap is made up with the help of a special ReactJS concept called “hooks”.

Hooks are special functions that allow ReactJS features to be used in functional
components.

This video is a sole property of Talent Battle Pvt. Ltd. Strict Penal Action will be taken against unauthorized piracy of this video
Functional components do not have access to dedicated state variables like class-based
components.

The only “state” that a functional component effectively has access to are the props
passed to it from its parent component.

ReactJS has access to a special hook called useState() that can be used for giving the
illusion of working with the state in functional components. The useState() is used to
initialize only one state variable to initialize multiple state variables, multiple useState()
declarations are required. The first value returned is the initial value of the state variable,
while the second value returned is a reference to the function that updates it. When the
state variable needs to be updated, it can be done by calling the update function and by
updating the state variable directly inside it.

Implementation………..

This video is a sole property of Talent Battle Pvt. Ltd. Strict Penal Action will be taken against unauthorized piracy of this video

You might also like