React-select & creatable select with reatc-hook-form focus on validation error

user_916365 0
Viewed 1274

I am using create select components inside a react-hook-form. I have tried the react-select and creatable-react-select both and the behaviour I experience in context of this issue is the same.

Using latest react-hook-form (7.6.1), I can't set the field to be focussed when there's an error bound to the field. CODE SANDBOX EXAMPLE FOR THIS

When I use an older version of react-hook-form, I can get this behaviour to work as expected. CODE SANDBOX EXAMPLE FOR THIS

As i want this behaviour to work in the latest react-hook-form, any suggestions on what is the problem in the first example?

react-select react-hook-form reactjs frontend javascript
1 Answers

using controller for react-select component but did not use prop "field" from "render" method of Controller, therefore, the ref element is not set in order to help react-hook-form to set focus.

Working sample: code sandbox

user_9163650
Related