Question

我在ScrollView中有一个TextInput。

当TextInput处于焦点时，滚动条不起作用。此问题仅影响Android。

Answer 1

设置

<ScrollView keyboardShouldPersistTaps="always"

结合下面的textInout组件（我为文本输入创建的自定义组件来解决此问题）解决了我的问题：

<TouchableOpacity
     activeOpacity={1}
     onPress={()=>this.input.focus()}>
     <View pointerEvents="none"
           <TextInput
              ref = {(input) => this.input = input}
           />
     </View>
</TouchableOpacity>

Answer 2

在scrollView中使用 keyboardShouldPersistTaps

<ScrollView keyboardShouldPersistTaps="handled">

它解决了你的问题

在此检查文档https://facebook.github.io/react-native/docs/scrollview.html#keyboarddismissmode

Answer 3

这是预期的行为。

了解更多信息Official TextInput documentation

您可能想尝试这样的事情：react-native-aware-scroll-view

Answer 4

这是一个很好的例子：http://blog.arjun.io/react-native/mobile/cross-platform/2016/04/01/handling-the-keyboard-in-react-native.html

对我来说真正重要的是添加：

android：windowSoftInputMode =“adjustResize”

在AndroidManifest.xml中

以便集中textInput

Answer 5

我对每个平台的处理方式不同（在Ios中，对inputText的关注就足够了，不要忘记将this.scrollViewRef ref放在包裹inputText的ScrollView内，并将ref索引输入inputText

if (Platform.OS == 'android') {
    this.inputRefs[field].measure((w, h, px, py, xPage, yPage) => {
        this.scrollViewRef.scrollTo({ x: 0, y: yPage, animated: true })
        this.inputRefs[field].focus()
    })
} 
this.inputRefs[field].focus()

当焦点文本输入反应原生时，scrollview无法滚动

5 个答案: