React Hook Form
Gestionar el estado y la validación de formularios complejos en React con el mínimo boilerplate.
Librería de formularios para React basada en hooks. Sin re-renders innecesarios, validación flexible y compatible con Zod, Yup y otros esquemas.
Notas y contexto
Qué es
React Hook Form es la librería de formularios más utilizada en el ecosistema React. A diferencia de Formik, usa componentes no controlados (uncontrolled) para minimizar los re-renders y consigue mejor rendimiento en formularios grandes.
Para qué sirve
- Registrar inputs con una sola línea:
{...register("email")}. - Validar campos con reglas propias o integrando esquemas de Zod, Yup o Joi mediante resolvers.
- Gestionar el estado completo del formulario (errores, valores, estado de envío) sin
useStatemanual. - Trabajar con formularios dinámicos, arrays de campos y formularios anidados con
useFieldArray.
Cuándo usarlo
Siempre que tengas formularios en React más allá de un input sencillo. Es especialmente valioso en formularios con muchos campos, validaciones complejas, o donde el rendimiento importa (listas de inputs, formularios de configuración).
Puntos clave
- Mínimos re-renders gracias al enfoque uncontrolled.
- Integración perfecta con Zod mediante
@hookform/resolvers/zod. - Compatible con React Native.
DevToolsoficial para depurar el estado del formulario en desarrollo.
Ten en cuenta
El modo uncontrolled puede ser un cambio mental si vienes de Formik. Para inputs de UI libraries como MUI o Radix que necesitan ser controlled, usar el componente Controller.