当在滚动视图中时，React Native需要轻按两次才能更改输入焦点

问题描述

想象一下带有多个TextInputs的简单ScrollView

Imagine simple ScrollView with multiple TextInputs like

  <ScrollView style={styles.container}>
    <TextInput style={styles.input} />
    <TextInput style={styles.input} />
  </ScrollView>

当我输入第一个输入时，键盘会打开，并且我可以输入文本.当我想更改为第二个输入时，我需要点按两次-第一个类型会关闭键盘，只有第二个点击会打开键盘进行第二个输入.

When I enter first input, keyboard opens and I can type text. When I want to change to second input I need to twice tap - first type closes keyboard and only second tap opens the keyboard for second input.

一种解决方案是使用keyboardShouldPersistTaps={true}-切换效果很好，但是根本没有关闭键盘，键盘可以覆盖一些以后的输入(或按钮).我也可以使用keyboardDismissMode，但是在拖动时只需关闭键盘即可.

One solution is to use keyboardShouldPersistTaps={true} - switching works fine however then keyboard is not closed at all and the keyboard can cover some of the later inputs (or buttons).I can also use keyboardDismissMode however that just close keyboard on drag.

我的问题是如何将这两种行为结合在一起-恕我直言，这是最佳的用户体验-当我单击另一个输入时，无需重新打开键盘即可立即更改焦点，而当我敲击其他地方的键盘时又会关闭?

My question is how to combine those two behaviour - into IMHO the best user experience - when I click another input, the focus is changed immediately without reopening keyboard and when I tap somewhere else the keyboard is closed?

我正在使用RN0.22，可以在 https://rnplay.org/apps/kagpGw中获得示例应用程序

I am using RN0.22 and sample application is available at https://rnplay.org/apps/kagpGw

更新-此问题可能已在RN 0.40中解决-请参见 https://github.com/facebook/react-native/commit/552c60192172f6ec503181c060c08bbc5cbcc5a4

UPDATE - This problem might have been solved in RN 0.40 - see https://github.com/facebook/react-native/commit/552c60192172f6ec503181c060c08bbc5cbcc5a4

推荐答案

我用这段代码解决了我的问题

I solved my problem with this code

<ScrollView
   keyboardDismissMode='on-drag'
   keyboardShouldPersistTaps={true}
>

这篇关于当在滚动视图中时，React Native需要轻按两次才能更改输入焦点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！