$cat~/glossario/controlled-component.md

Controlled Component

React

Input cujo valor é controlado por state React.

controlled-component.mdmarkdown
01

seção

Explicação

Controlled Component — Input cujo valor é controlado por state React.

Input value driven React state — onChange updates state — single source truth form.

Uncontrolled use ref defaultValue legacy.

02

seção

Exemplo

snippettsx
const [email, setEmail] = useState("");<input value={email} onChange={(e) => setEmail(e.target.value)} />
03

seção

Modo de uso

  • Validation live

  • Submit controlled gather state

  • Disable submit invalid

04

seção

Armadilhas comuns

  • value undefined uncontrolled warning

  • Forget onChange read-only input

05

seção

Termos relacionados