首页 > 解决方案 > 如何在 React Native 中仅接受对视图某些区域的触摸?

问题描述

我有这个视图层次结构:

   <View style={{ flex: 1 }}>
    <View ... />
    <View style={{
      position: "absolute", 
      bottom: 0, 
      right: 0, 
      width: Dimensions.get("screen").width, 
      height: Dimensions.get("screen").height,
      backgroundColor: 'rgba(52, 52, 52, 0)'
    }}
      pointerEvents='none'
    >
      <WebView
        pointerEvents='none'
        style={{ flex: 1, backgroundColor: 'rgba(52, 52, 52, 0)' }}
        source={require("source/assets/tawkto.html")}
      />
    </View>
  </View >

我的 html 由 1 个小部件元素和一个透明背景组成。显示 html 的 WebView 位于我的层次结构中每个视图的顶部。所以我的问题是是否可以仅在小部件区域(例如我知道的固定矩形区域)上接受触摸。通过使用pointerEvents我实现了视图根本不接受触摸。

标签: react-native

解决方案


尝试添加<View pointerEvents={'none'} />您希望禁用触摸的视图


推荐阅读