React-Native TextInput multiline, переключение на следующий ввод, не хочу добавлять новую строку - PullRequest
Новая
       36

React-Native TextInput multiline, переключение на следующий ввод, не хочу добавлять новую строку

0 голосов
/ 05 июня 2018

Я подозреваю, что, возможно, я не смогу сделать это в данный момент ... но это не помешает спросить некоторые идеи!У меня есть несколько многострочных TextInputs на одной странице, и я хотел бы иметь возможность использовать кнопку «next» для перехода к следующему TextInput.

Я могу переключать входы без проблем, однако ... Я должен выбрать между использованием «blurOnSubmit» - которое не добавляет новую строку, но оно закрывает клавиатуру.Это делает опыт Android действительно плохим, когда следующий ввод сфокусирован.Он делает то же самое для iOS, но iOS справляется с этим немного лучше.

Или я не могу использовать blurOnSubmit, а затем мне нужно убедиться, что я сам обновляю состояние, чтобы вручную удалить '\ n', то естьдобавлено ...

У кого-нибудь есть лучшее решение?

Типичная страница выглядит примерно так (очищены все декорации и просмотр по сравнению с логикой редактирования): 

<View>
<TextInput
    autoCapitalize="none"
    autoCorrect={false}
    multiline={true}
    onChangeText={(valueA) => this.setState({ valueA })}
    onSubmitEditing={() => this._onSubmitEditing(this.refs.B)}
    returnKeyType={"next"}
    value={this.state.valueA}
    ref="A"
/>
<TextInput
    autoCapitalize="none"
    autoCorrect={false}
    multiline={true}
    onChangeText={(valueB) => this.setState({ valueB })}
    onSubmitEditing={() => this._onSubmitEditing(this.refs.C)}
    returnKeyType={"next"}
    value={this.state.valueB}
    ref="B"
/>
<TextInput
    autoCapitalize="none"
    autoCorrect={false}
    multiline={true}
    onChangeText={(valueC) => this.setState({ valueC })}
    onSubmitEditing={this._validateAndSave}
    returnKeyType={"done"}
    value={this.state.valueC}
    ref="C"
/>
</View>

Связанные функции: 

    _onSubmitEditing (nextRef) {
        if(!!nextRef && nextRef.focus) {
            nextRef.focus();
        }
    }
...