Как использовать ловушку useRef для выбора следующего TextInput после нажатия следующей кнопки клавиатуры с избыточной формой

Question

Я знаю, что мы можем сделать это легко с помощью метода класса response. Потому что у нас есть this.ref. но я не уверен, как это сделать с помощью ловушки useRef в функциональном компоненте.

с использованием написанных трюков здесь

Вот как я пытаюсь это сделать.

  ...

  const inputEl1 = useRef(null);
  const inputEl2 = useRef(null);
  return (
        <Field
            name="first_name"
            component={MyTextInput}
            placeholder="First name"
            ref={inputEl1}
            refField={inputEl1}
            onEnter={() => {
              inputEl2.current.focus();
            }}
          />
          />
          <Field
            name="last_name"
            placeholder="Last name"
            component={MyTextInput}
            ref={inputEl2}
            refField={inputEl2}
          />
)
...

Так что мне нужно передать ref из поля в MyTextInput и на nextKeyPress я хочу сфокусироваться на втором компоненте ввода, т.е. inputEl2

// Мой текстовый ввод

...
render() {
    const {
      input: { value, onChange, onBlur },
      meta: { touched, error },
      keyboardType,
      placeholder,
      secureTextEntry,
      editable,
      selectTextOnFocus,
      style,
      selectable,
      customValue,
      underlineColorAndroid,
      autoFocus,
      maxLength,
      returnKeyType,
      onEnter,
      refField,
    } = this.props;
    const { passwordVisibility, undelineColor } = this.state;

    return (
      <View style={{ marginVertical: 8 }}>
        <TextInput
          style={[{
            height: 50,
            paddingLeft: 20,
            color: Colors.SECONDARY_COMMON,
          }, style]}
          onBlur={val => onBlur(val)}
          keyboardType={keyboardType}
          underlineColorAndroid={undelineColor}
          placeholder={placeholder}
          returnKeyType={returnKeyType || 'go'}
          value={customValue || value.toString()}
          onChangeText={onChange}
          maxLength={maxLength}
          onSubmitEditing={onEnter}
          ref={refField}
        />
)
}

Answer 1

Если ребенку необходимо использовать опору, например, как ссылку <TextInput ref={refField}..., то опора должна быть ссылкой (а не строкой):

<Field refField={inputEl2} ...