Version 7 | Version 6
- Built with performance and DX in mind
- Embrace native form validation
- Simple integration with UI libraries
- Tiny size without any dependency
- Follows HTML standard for validation
- Resolvers support Yup, Zod, Superstruct, Joi, Vest or custom
npm install react-hook-form
import React from 'react';
import { useForm } from 'react-hook-form';
function App() {
const {
register,
handleSubmit,
formState: { errors },
} = useForm();
const onSubmit = (data) => console.log(data);
return (
<form onSubmit={handleSubmit(onSubmit)}>
<input {...register('firstname')} /> {/* register an input */}
<input {...register('lastname', { required: true })} />
{errors.lastname && <p>Last name is required.</p>}
<input {...register('age', { pattern: /\d+/ })} />
{errors.age && <p>Please enter number for age.</p>}
<input type="submit" />
</form>
);
}
![](https://raw.githubusercontent.com/react-hook-form/react-hook-form/master/docs/ads-1.jpg)
Thanks go to these kind and lovely sponsors (company and individuals)!
Thanks go to all our backers! [Become a backer].
Thanks go to these wonderful organizations! [Contribute].
Thanks go to these wonderful people! [Become a contributor].