✅ – ✅ – Kuba – 22-47 May 20

Question

Hello!
I'm struggling with integrating  react-hook-form. I have custom range input component, that I use with RHF by exposing the input with forwardRef.

I need to access the current value of the input for two things:
Display the initial value of the input.
Update the displayed value.

Both props.value and props.defaultValue are undefined. I tried to create a ref inside of the RangeInput, and useImperativeHandle for exposing it, but then the RHF wan't working.

Apparently forwarded ref is a function, so ref.current doesn't exist either.

Here's a link to the sandbox: https://codesandbox.io/p/sandbox/rhf-forwardref-p6puwp?file=%2Fsrc%2Ffeatures%2FSettings%2FRangeInput.tsx%3A1%2C1

Thanks in advance for any help

✅ – ✅ – Kuba – 22-47 May 20

Looking for more? Join the community!