在允许孩子捕捉触摸的同时防止父母被点击

Question

在react-native中，有时防止父母捕捉和处理触摸/点击事件同时允许其子女接收事件并作出反应是有用的。具体来说，这在使用<View/>或<ImageBackground/>容器作为其子元素的透明背景时非常有用（例如：基于渐变的阴影或用于居中绝对定位元素的包装器视图）。

Answer 1

React Native为pointerEvents元素提供了<View/>道具，可以将其设置为'none'，以便停止对触摸和点击作出反应，但是允许孩子仍然是可触摸的是将pointerEvents道具设为'box-none'而不是'none'。

警告：与常规CSS相比，pointerEvents是“ prop 而非样式。所以要使用它，你可以做到

<View style={styles.parentWithoutTouchEvents} pointerEvents='box-none'>
   <View style={styles.touchableChild}>
   </View>
</View>