Entrevista · Formularios
Controlado vs No controlado
¿Quién tiene la verdad del input?
Un componente controlado delega el valor del input a React — el estado es la fuente de verdad. Un componente no controlado deja que el DOM guarde el valor y lo lee con una ref cuando hace falta.
Controlado
value viene del estado y onChange lo actualiza. React controla cada pulsación. Ideal cuando necesitas validación en tiempo real, transformar el input mientras el usuario escribe, o sincronizar varios campos.
No controlado
El DOM guarda el valor. Lo lees con useRef en el momento que necesitas (por ejemplo, al hacer submit). Más simple para formularios donde no importa el valor intermedio — como un upload de archivo.
Tropiezos comunes
- 01Mezclar value sin onChange produce un input 'read-only'. React te lo avisa en consola.
- 02defaultValue no es lo mismo que value — defaultValue es solo el valor inicial (no controlado).
- 03Para inputs de tipo file nunca se usan controlados porque el navegador no permite setear su valor por seguridad.
¿Fue útil?
Inicia sesión para dar feedback