У React Native TextInput нет метода фокуса

Question

Я копался и не могу найти подходящий способ сфокусировать следующий TextInput в форме. Я использую React Native 0.61.5 и React 16.9.0 и настроил проект с помощью шаблона Typescript. Большая часть того, что я обнаружил в Интернете, использует более ранние версии React Native или React, и я не могу понизить версию, потому что это проект компании, и какие версии мы используем до разработчиков.

Документация React Native https://facebook.github.io/react-native/docs/textinput#__docusaurus не показывает метод .focus (), существующий в TextInput. Есть onFocus, но это происходит после того, как TextInput был сфокусирован, это не помогает нам установить фокус на конкретный TextInput на экране после нажатия клавиши возврата.

Использование ссылок является разумной идеей:

inputRef = React.createRef <'TextInput> (); // (запятая после <, потому что он продолжал скрывать код) </p>

Intellisense для наведения на inputRef: (свойство) LoginForm.inputRef: React.RefObject <'TextInput> // (запятая после <, потому что он продолжал скрывать код) </p>

Я использую эту ссылку следующим образом:

this.inputRef? .current? .focus ();

но я продолжаю получать ошибку машинописного текста:

Свойство 'focus' не существует для типа 'TextInput'.

Что, учитывая документацию, имеет смысл, поскольку я не удалось найти его как свойство.

Intellisense для TextInput при наведении курсора на атрибут ref: (атрибут JSX) React.ClassAttributes.ref ?: string | ((экземпляр: TextInput | null) => void) | React.RefObject | ноль | undefined

Я хочу иметь возможность нажать клавишу возврата на виртуальной клавиатуре Android / ios и перенести фокус на следующий TextInput, чтобы я мог отправить форму.

Answer 1

<TextInput
    placeholder = "FirstTextInput"
    returnKeyType = { "next" }
    onSubmitEditing={() => { this.secondTextInput.focus(); }}
    blurOnSubmit={false}
/>

<TextInput
    ref={input => { this.secondTextInput = input; }}
    placeholder = "secondTextInput"
/>

Answer 2

Объект, созданный с помощью React.createRef(), имеет следующую форму

{ current: TextInput }

Вы можете получить доступ к элементу ввода текста, выполнив:

inputRef.current.focus();