In this video, I have shown how we can use React Hook Form with Material UI to create re-usable forms. All the codes are in this repo github.com/Mohammad-Faisal/re...
This is a terrific video. I hope you continue to post. Such clean code and well described. Thank you for saving me a huge amount of time to understand how to put these two technologies together!
@Mohammad Faisal Thank you so much, this is the best video about react hook form i've seen so far, Please i have a problem, and i need your help; i'am using material ui check box, to filter some data, i'am tracking any changes on the check box input using values = watch(), and i use "values" as a depndency inside useEffect to track changes. As a result, whenever i check a checkbox inout, an infinite loop take place. Any help please?
Your repo is a bit different. in the repo, you did not use the provider, and instead sent the 'control' as a prop to each of the input controls. is that a better way to go? Also I would love to see implementation of custom errors and validation using mui components. thanks!
his form is flat. if using nested components with inputs at various levels, I think using formProvider would be better. Otherwise you could be prop drilling that control prop pretty deep.
@@56faisal If you investigate this, please post it as a subsequent video. I don't need this at the moment, but I'm sure I will at some point. Thanks for your excellent video. I was going to switch to formik because I didn't fully understand what react-hook-form was doing with material-ui components -- now I have a somewhat better understanding.
lots of things missing, how do you set a field as required? how do you pass a value if its for updating a form? how do you set a custom error message? nothing is in this video
With due respect. Showing how to handle a required field is not the purpose of this video. I tried to show how to integrate with hook-form. Going deep into material ui is not the purpose here