How to define type of ref parameter when using React.forwardRef()?

94 Views Asked by At

My typescript compiler is throwing an error when using the forwardRef function. How should I be defining the type for ref?

Form.tsx

//react hook form 
    const {
        handleSubmit, 
        register, 
        watch, 
        formState: { errors }, 
    } = useForm( { defaultValues: state, mode: "onSubmit" }); 

// Input Component
<Input 
    {...register("firstName", { required: "First name is required"})}
     id="first-name"
  />

Input.tsx

export const Input = forwardRef((props, ref:RefType) => {
  return <input ref={ref} className="form-control" {...props} />;
});           //typescript error 

// what should RefType be? 

As a workaround I assigned ref: any to get rid of the compiler error.

0

There are 0 best solutions below