I'm hoping I'm close to translating my old react hook forms to RHF7 but i'm stuck trying to share refs twice with 2 different inputs. Can someone help me finish this code...So I basically need a ref on both dobMonth and dobYear but I can't use the same ref twice so I need to create a second one but it won't let me.
const dobMonthInput = useRef(null)
const dobYearInput = useRef(null)
const {
register
} = useForm()
const { ref, ...rest } = register('dobMonth', {
required: true,
validate: (value) => validateDate(value, getValues),
onChange: (e) => onChange(e),
})
/*const { ref, ...rest } = register('dobYear', {
required: true,
validate: (value) => validateDate(value, getValues),
onChange: (e) => onChange(e),
})*/
....
<input
name="dobDay"
type="text"
{...register('dobDay', {
required: true,
validate: (value) => validateDate(value, getValues),
onChange: (e) => onChange(e),
})}
/>
<input
name="dobMonth"
type="text"
{...rest}
ref={(e) => {
ref(e)
dobMonthInput.current = e
}}
/>
<input
name="dobYear"
type="text"
{...rest}
ref={(e) => {
ref(e)
dobYearInput.current = e
}}
/>
I eventually need to use dobMonthInput.current.focus() and dobYearInput.current.focus()
I get the error Identifier 'ref' has already been declared for obvious reasons but i don't know how to get around it. Thanks
from Sharing ref usage twice in React Hook Forms 7
No comments:
Post a Comment