React native 反应本机检测点击查看

我正在编写一个React原生应用程序，我想检测屏幕上任何地方的点击/点击，所以我在

元素上放置了一个onClick处理程序，但它似乎不起作用。以下是我的渲染函数：

<View style={styles.container} onClick={this.onClick}>
    <Text style={styles.welcome}>
        Tap to change the background
    </Text>
</View>

点击以更改背景

---

我需要做什么？

要使任何元素在React本机UI中处理触摸/点击事件，需要将该元素放入可触摸不透明度、可触摸无反馈、可触摸本机反馈或可触摸高亮显示元素中：

<TouchableHighlight onPress = { this.onClick }>
    <View style={styles.container}>
    <Text style={styles.welcome}>
        Tap to change the background
    </Text>
    </View>
</TouchableHighlight>

点击以更改背景

---

希望对您有所帮助。

在React Native version>55.3中，如果使用onStartShouldSetResponder道具，您可以检查视图中的Press事件

例如：

<View 
    style={{ flex: 1 }}
    onStartShouldSetResponder={() => console.log('You click by View')}
 >

    <ScrollView 
        refreshControl={
           <RefreshControl 
               refreshing={this.state.refreshing}
               onRefresh={this.onRefresh} />
           }
      >

     <Text>Awesome</Text>

    </ScrollView>
</View>

console.log（'youclickbyview'）}
>
真棒

---

在这个示例中，我展示了如何在视图中获取onPress事件，而不阻塞它们后面的其他事件。刷新控件仍然可以正常工作。

在我的情况下，以下功能可以正常工作。您可以通过道具在任何

视图上使用
onTouchStart
和
onTouchEnd
处理程序，例如：

<View onTouchStart={() => this.doSomething()} />

this.doSomething（）}/>

最简单的方法是：

<TouchableOpacity style={styles.container} onPress={()=> whateverFunc(parameter)}>
    <Text style={styles.welcome}>
       Tap to change the background
    </Text>
</TouchableOpacity>

whateverFunc（参数）}>
点击以更改背景

因此，您需要将“视图”组件替换为“TouchableOpacity”或任何其他可触摸组件，还需要将“onClick”道具替换为“onPress”。这就是全部。使用可触摸组件包装视图根本不需要。
React Native不是ReactJSi假设您正在更改视图颜色。。。尝试通过其样式将颜色设置为TouchableHighlight元素。这在Android上似乎不起作用。例如，onTouchEnd。尽管iOS工作正常，但我必须在视图中添加背景色，在我看来是透明的。。这就成功了。。很糟糕，这真的很有帮助