React Hook Form - Get Started

volume soooo low 😥
but ty for the tutorial

I can't get past 30 seconds into this tutorial. I started a new React + vite app, added a single "form" component with two inputs, and as soon as I try to use the useForm hook, my console is full of errors. I have nothing else in this app, but it says I have invalid hook call and dispatcher is null. I have no way of understanding these errors in context or debugging them. I dunno what to do when I can't follow the very first step of the tutorial

Goddamn this is easy to do and easy to understand, thanks a lot!

what a gigachad, i love it so much!
handle every basic usecase <3

loved the way you describe things here.

Well elaborated.... Just what i need to get started!

Great video. How do I mask custom fields using the Controller? How do I pass the value to the UseForm using the value inside the field and not with state on the form?

Very useful !!

HI i have upgraded from 7.31.1 to 7.44 . but I got this error .
./node_modules/react-hook-form/dist/index.esm.mjs
Can't import the named export 'Fragment' from non EcmaScript module (only default export is available)
not sure how can fix this issue ?

Thank you so much for this!

Amazing❤

thanks Mr. guru for this great tut, it's just straight forward ❤

If i want a form for a order,not a new user register,just to take the information entered in the form to make a order,so i use the register method or do i have another separate method?

nice course ! can you do a useTable series?

Thanks!

Simply the best

awesome!

Thanks man , great tutorial . +1 for sound and video quality

Cool

Great tutorial. Informative and concise! Keep up the good work man.

I found this playlist very difficult first...Then I realized that the orders are just randomized...else it's a great playlist

Wow. It took me 10 minutes to set up a form with this. Great library

This is awesome, thanks @Beier Luo

Hey, thnx for the video. quick question, I am using typescript and when i try to put error message in p tag, it gives me an error of " Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'. " Any advice how can i fix it? Thnx in advance

be water my friend

Audio is a little hard to hear. Otherwise really helpful, thanks.

Brilliant!

source code?

goood, gracias por esta gran herramienta que nos facilita a la hora de codear, saludos desde Argentina..

Hello, I am trying to get this to work with a dropdown menu but it doesn't seem to submit at all when the dropdown logic is in there. It works fine when I remove the dropdown though. (Strategy is mapping array into select options.) Would you know how to integrate that working with useForm?

Thanks Bill!

But what about if the user AutoCompletes the form? My example still toggle thru all the required fields even if filled in correctly.

Thanks 🍻

Can you please tell that how can we add icon also password hide and show process

Awesome, thank you so much, very pedagogic style and very progressive for a beginner. :))))

What is the strategy to build something like this? The project I've recently joined has very large nested forms and whole monolithic state gets updated on each keystroke. The poor performance makes my eyes bleed. Sadly we aren't allowed to install anything other than pre-approved dependencies, so I was hoping to take some inspiration from this library to build something that could improve the performance.

For now, I have split the parts of form using contexts to limit the state updates to one part.

in my form the errors doesnt work in the first render, the it works , what am I doing wrong , I did exactly the as the video.Also it renders no matter if theres errors or not, I am stuck, don't know what's wrong

Great video. Was taking a Udemy class and they used redux form. I got tired of trying to do some stuff with it. So I decided to find a library that may be easier\better to use. Found React Hook Form and going to give it a whirl. Thanks for the great intro

Great overview, thank you!

Hi @Bill Luo, I'm a big fan of RHF. I have a question, this might be a noob question but on your other vid you mentioned the component will only render once, it won't render on submit if you don't use `errors`. My question is how did RHF know if the component uses/subscribes to `errors`?

Used some similar libraries before. I have to say this is the best library for building form in react hands down. Great job 'Bruce lee'...lol. This is awesome.

Just I have simple form with 5 text fields
With MUI 5 and React hook forms.

I created a component for text field in MUI 5 .

I want to write a controller for every field or in component level using useFormContext...

Which is the best practice...

Please give reply....

Please do sample code in sandbox ..

Please...

Thanks for the video Bill, do you have any video that explains how to preventDefault

This is an amazing library. I have my own component and i want to register using ref bcs my input is inside of a component. I found the solutions but they're using version of < 17.. When I check it, many of types on that solution is cannot be found on 17.. pls help making video of how to register using ref on typescript component.. Good work btw!!!

Thank you

Thanks for this amazing library, I just wondering how can i supply a message when pattern doesn't match?

Thank you so much for the video!

very good
can you record complete video for composition of react hook form and material Ui 5 ?

thank you