Professional Documents
Culture Documents
Refs, Controlled, Umcontrolled Form
Refs, Controlled, Umcontrolled Form
React State,
React Refs
Value attribute,
Name attribute,
onChange event
Controlled Forms
➢ A controlled form in React is like a form where React controls all the input elements.
➢ This means that the values of the form elements are stored in the component's state
and are updated through React.
➢ When a user interacts with the form (like typing in an input field), React updates the
state, and the value of the input field reflects what's in the component's state.
import React, { useState } from 'react'
Uncontrolled Forms
➢ An uncontrolled form in React is like a form where React doesn't directly manage the
values of the input elements.
➢ Instead, the values of the form elements are managed by the DOM (the web page
itself).
App.jsx
import React, { useRef } from 'react'