接口中的 React.ref 属性

Question

I tried putting string as the ref but I get an warning when I try to use ref?.current

Property 'current' does not exist on type 'string'

What should be used for ref prop in the interface. I don;t know what the ref type would be upfront. It could be HTMLInputElement it could be a div basically it could be any element.

interface IProps {
 name: string,
 time: number
 ref?: string
}

Answer 1

Ref in React is generally described by the following interface: React.Ref<HTMLInputElement> .

Try:

interface IProps {
 name: string,
 time: number
 ref?: React.Ref<HTMLInputElement>
}

Answer 2

TypeScript won't let you pass a generic (as in: not known in advance) React.Ref<HTMLElement> or React.Ref<Element> .

You need to trick the type checker to accept your ref by using any .

interface Props {
  name: string;
  time: number;
  ref?: React.Ref<any>;
}

Keep in mind that this solution is not entirely type-safe.