在键盘识别滚动视图中的textInput之后按React-Native按钮

时间:2017-11-22 08:38:48

标签: javascript android ios reactjs react-native

我遇到问题,我在KeyboardAwareScrollView内有 TextInput 按钮。我希望用户输入一些文字,然后按 TouchableOpacity 制作的按钮。这将向前发送用户刚输入的文本。

问题是输入文字后,首先尝试 TextInput 只会失去焦点。只有在下一次按下尝试时才会实际按下按钮。如何在第一次按下时按钮响应?

我正在使用此程序包https://github.com/APSL/react-native-keyboard-aware-scroll-view

我的代码如下:

import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view'

export default class App extends Component<{}> {
  render() {
    return (
      <KeyboardAwareScrollView>
        <TextInput
          style={{ width: 100, height: 50, backgroundColor: 'blue' }}
        />
        <TouchableOpacity 
          style={{ backgroundColor: 'red', width: 50, height: 50 }}
        />
      </KeyboardAwareScrollView>
    );
  }
}

1 个答案:

答案 0 :(得分:7)

请在ScrollView上使用 keyboardShouldPersistTaps ='always'。以下是如何做到这一点。

<ScrollView
            keyboardShouldPersistTaps='always' >
</ScrollView>

这种情况正在发生,因为ScrollView具有首先解除键盘的属性,然后它将允许对其子视图执行操作。现在我们正在用上面的属性改变这种行为。