^7
^5
npm install react-hook-form-antd
You may have an original antd form like below
Check the EXAMPLE for this form after using react-hook-form-antd
!
All you need to do:
useForm
from react-hook-form
and get control
FormItem
from react-hook-form-antd
instead of Form.Item
control
to all FormItem
(Field names can be inferred by control
๐)rules
and use react hook form resolver instead (You can use schema from any validation libraries ๐คฉ)handleSubmit
in onFinish
FormItem
Ant Design
Form.Item
API
A component instead of Form.Item
in antd. It has inherited all props from Form.Item
except rules
validateStatus
(If you need rules, please use react hook form resolver instead)
Added and modified props:
Prop | Type | Description |
---|---|---|
control |
Control | control object from useForm |
name |
string | form field name |
When using an upload component, set shouldFocusError: false
in your useForm
configuration. This will prevent React Hook Form from trying to focus on the error, effectively resolving the issue.
Thanks goes to these wonderful people (emoji key):
Yeyang (Justin) Sun ๐ป ๐ค ๐ง ๐ |
Jakub Szewczyk ๐ป |
Dino Muharemagiฤ ๐ป ๐ |
avegatolber ๐ป ๐ |
Ahmed Rowaihi ๐ป |
Yorman Rodriguez ๐ |
Sinan ๐ |
nagamejun ๐ ๐ป |
This project follows the all-contributors specification. Contributions of any kind welcome!