Spreading register of hook form and using it in another component

Question

I am passing register using spread operator. It works when I use on the page its fine. But when I use another component it is not why ??

This is my input component :

export const TestInput = ({ ...props }) => {
  return <input {...props} />;
};

I am using it like this :

console.log(watch("name"))
 <TestInput {...register("name")} /> // THis doesnt work
 <input {...register("name")} /> // This works

Tan · Accepted Answer

It was due to I didn't passed got ref in child component

Spreading register of hook form and using it in another component

1 Reply