在 Native Base 上打开键盘时如何避免双击？

Posted 2023-04-14

【中文标题】在 Native Base 上打开键盘时如何避免双击？

【英文标题】：How to avoid double tap when keyboard is open on Native Base?

【发布时间】：2017-11-25 19:55:32

【问题描述】：

这是关于 React Native 应用程序的 Native Base 框架的问题：

想象一个订阅屏幕； 1 个文本输入和一个订阅按钮；

输入电子邮件地址后，我想点击订阅按钮，但我的第一次点击只会关闭键盘，我需要再次点击才能按下按钮。如何避免这种情况？我的预期行为是第一次点击是按下按钮。 （据我所知，这是 组件周围的东西，但我不确定。）

（我已经在本地厨房水槽应用程序上检查过这个问题，同样的问题也发生在那里。只需转到：“表单和输入”部分并查看“固定标签”）

【问题讨论】：

您可能需要检查this。这个问题和你的不一样，但它可能会给你一些想法。

还有用 NativeBase 的 Input 和 InputGroup 组件代替 RN 的 TextInput 怎么样？

@milkersarac 感谢 cmets，但我使用了一些自定义文本输入，这就是原因，但我接受的答案解决了问题。

很高兴，太好了！

【参考方案1】：

将此作为道具传递给内容组件。

< Content keyboardShouldPersistTaps='always'>

【讨论】：

太棒了，这很有效（虽然我还没有经历过影响）非常感谢！我用谷歌搜索了很多！

在我的情况下，我需要将它添加到 flatlist 组件中

【参考方案2】：

如果您使用< Content keyboardShouldPersistTaps='always'>，则在选择按钮后或在输入字段外点击时，键盘不会消失。为确保在您在输入字段外点击时键盘消失，请使用

< Content keyboardShouldPersistTaps='handled'>

但是，如果您选择一个按钮（而不是屏幕的空白部分），即使该按钮的 onPress 事件将被触发，键盘也不会消失。为了使键盘在按下按钮后消失，按钮的 onPress 处理程序应该调用

Keyboard.dismiss()

不要忘记包含导入语句：

import  Keyboard  from 'react-native';

更多详情请见https://facebook.github.io/react-native/docs/scrollview.html#keyboardshouldpersisttaps

【参考方案3】：

keyboardShouldPersistTaps 这个属性现在存在于 ScrollView 中。

<ScrollView keyboardShouldPersistTaps="always">
     ..content or component
</ScrollView>

更多详情请查看官方文档

https://facebook.github.io/react-native/docs/scrollview#keyboardshouldpersisttaps