TouchableOpacity 作为 ListView 中的 Item 仅在 TextInput 失去焦点后才会反应 [英] TouchableOpacity as Item in ListView only reacts after TextInput has lost focus

问题描述

我现在正在研究一个由 TextInput 和 ListView 组成的搜索组件.它从外部服务器加载结果并相应地填充 ListView.

I'm working on a search component right now which consists of a TextInput and a ListView. It loads its results from an external server and fills the ListView accordingly.

还有一个关闭搜索组件的 TouchableOpacity.

There's also a TouchableOpacity which closes the search component.

不幸的是，需要两次按下才能调用 TouchableOpacity 的 onPress 回调——一次让 TextInput 失去焦点，另一次触发回调.但是，如果我按下 TouchableOpacity 关闭搜索组件，或者按下react-native-scrollable-tab-view"组件的选项卡之一，它会立即做出反应，TextInput 甚至会保持其焦点.

Unfortunately, it takes two presses to get the onPress callback of the TouchableOpacity called – one to let the TextInput lose its focus and one to trigger the callback. But if I press the TouchableOpacity to close the search component or if I press one of the tabs of the "react-native-scrollable-tab-view" component it reacts immediately and the TextInput even keeps its focus.

所以，我想知道是否有人知道 ListView 是否因其滚动功能而以某种方式消耗了触摸.

So, I'm wondering if someone knows if the ListView somehow consumes the touches due to its scroll functions.

推荐答案

ScrollView(和遗留的 ListView)组件有一个 prop keyboardShouldPersistTaps 需要三个选项:

The ScrollView (and legacy ListView) component has a prop keyboardShouldPersistTaps which takes three options:

• never(默认值)，当键盘向上时，在焦点文本输入之外敲击会关闭键盘.发生这种情况时，儿童将不会收到水龙头.
• always，键盘不会自动关闭，滚动视图不会捕捉点击，但滚动视图的孩子可以捕捉点击.
• handled，当点击被孩子处理(或被祖先捕获)时，键盘不会自动关闭.

• never (the default), tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap.
• always, the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps.
• handled, the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor).

<ScrollView keyboardShouldPersistTaps="always">
  // Your TextInput and Button here…
</ScrollView>

我将此属性设置为 true，它按预期工作.=)

I set this property to true and it works as expected. =)

这篇关于TouchableOpacity 作为 ListView 中的 Item 仅在 TextInput 失去焦点后才会反应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！