TouchableOpacity作为ListView中的项目，只有在TextInput失去焦点后才会响应。

Question

我现在正在开发一个搜索组件，它由一个文本输入框和一个列表视图组成。它从外部服务器加载结果，并相应地填充ListView。

还有一个TouchableOpacity来关闭搜索组件。

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

因此，我想知道是否有人知道ListView是否由于其滚动功能而消耗了触摸事件。

- webwelten

Answer 1

ScrollView（包括传统的 ListView）组件有一个属性 keyboardShouldPersistTaps，它有三个选项：

• never（默认值），当键盘弹起时，点击文本输入框之外的区域会使键盘消失。此时，子组件将不会接收到点击事件。
• always，键盘不会自动消失，滚动视图也不会捕获点击事件，但是滚动视图的子组件可以捕获点击事件。
• handled，当点击事件被子组件处理（或被祖先组件捕获）时，键盘不会自动消失。

示例

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

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

- webwelten

---

不起作用。每当在 scrollView 中放置一个文本输入框和一个按钮 - 在输入值后，您需要按两次按钮才能使其工作。第一次是为了让文本输入框失去焦点，第二次是为了让按钮工作。还有其他解决方案吗？ - Abhishek Nalin

抱歉。在scrollView上也适用。我之前是将此属性应用于子组件的scrollView上。当我将其应用于父组件时，它开始正常工作。 - Abhishek Nalin