Home > Net >  react native textinput ref typescript
react native textinput ref typescript

Time:02-27

Whats the right type to use in my text input ref ?

It shows me error on line " <TextInput ref <-">

const RefComponent = () => {
  
  const inputRef = useRef<HTMLInputElement | null>(null);
  return (
    <TextInput ref={inputRef} style={{height: 100, width: 500, backgroundColor: 'red', padding: 10}} />
  )
};

Error:

No overload matches this call.
  Overload 1 of 2, '(props: TextInputProps | Readonly<TextInputProps>): TextInput', gave the following error.
    Type 'MutableRefObject<HTMLInputElement | null>' is not assignable to type 'LegacyRef<TextInput> | undefined'.
      Type 'MutableRefObject<HTMLInputElement | null>' is not assignable to type 'RefObject<TextInput>'.

What I am doing wrong ?

CodePudding user response:

HTMLInputElement works with web. For react-native, you can use following

const inputRef = useRef<typeof TextInput | null>(null);
  • Related