【问题标题】:Show keyboard programmatically using React native使用 React native 以编程方式显示键盘
【发布时间】:2016-12-23 20:32:03
【问题描述】:

如何使用 react native 以编程方式显示 TextInput 的键盘?使用 ScrollView,在 TextInput 之间点击会导致键盘被关闭。我想使用 TextInput 的 onFocus 方法再次显示键盘。无论如何要做到这一点?

【问题讨论】:

    标签: ios react-native


    【解决方案1】:

    考虑参考您的 textInput :

    <TextInput ref={(ref)=>{this.myTextInput = ref}} />
    

    当你必须再次关注它时,请使用:this.myTextInput.focus()

    编辑 React16

    对于 react16,使用 React.createRef 创建引用。

    【讨论】:

      【解决方案2】:

      您的 ScrollView 需要包含 keyboardShouldPersistTaps 属性:

      <ScrollView keyboardShouldPersistTaps></ScrollView>
      

      【讨论】:

      • &lt;ScrollView keyboardShouldPersistTaps='always'&gt;&lt;/ScrollView&gt;
      • 实际上&lt;ScrollView keyboardShouldPersistTaps='handled'&gt;&lt;/ScrollView&gt; 提供了更好的用户体验——用户可以通过点击任何其他“可点击”的 UI 元素来关闭键盘。
      【解决方案3】:

      没有 ScrollView 仅适用于 ios。 将此组件放在您需要键盘出现的代码周围:

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

      链接:https://reactnative.dev/docs/scrollview#keyboardshouldpersisttaps

      【讨论】:

        猜你喜欢
        • 2020-09-30
        • 2012-04-04
        • 2012-07-11
        • 1970-01-01
        • 2020-08-22
        • 2010-10-29
        • 2020-07-24
        • 2011-08-20
        相关资源
        最近更新 更多