Add Type to useForm
How do I make the object that I am manipulating, with the help of useForm hook, type safe?
For instance, I know I can do things like:
But how do i ensure
email
is type-safe with respect to some interface? For instance, I have a user
interface that I would like to apply to my useForm, so that way I make sure I only perform the proper useForm actions on the fields that exist for user
3 Replies
Hi @nick_montoya. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
You can make your form type-safe by defining an interface for your form values and passing it to the
useForm
hook. This way, TypeScript will enforce that the fields you're manipulating with useForm
match the fields in your interface.
Here's an example of how you can do this:
In this example, IUser
is the interface that represents your user. By passing IUser
to useForm
, you're telling TypeScript that the form values should match the IUser
interface. This means that if you try to register a field that isn't in IUser
, TypeScript will give you an error.
This example is based on the information provided in the refine documentation (https://refine.dev/docs/api-reference/core/hooks/useForm/) and blog (https://refine.dev/blog/react-crud-app-with-dynamic-form-ant-design/).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@263527875506995202> kapa.ai is still learning and improving, please let us know how it did by reacting below
continuing-cyan•13mo ago
Hey @nick_montoya,
You can check the generics of the
useForm
on the documentation -> https://refine.dev/docs/api-reference/core/hooks/useForm/#type-parameters