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

Question

在react-native有时，防止父级捕获和处理触摸/单击事件，同时允许其子级接收和响应事件很有用。具体而言，当使用充当其子元素的透明背景的<View/>或<ImageBackground/>容器(例如：用于将绝对定位的元素居中的基于渐变的阴影或包装视图(时，这很有用。

Answer 1

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

警告：与常规CSS相比，pointerEvents是道具而不是样式。所以要使用它，你可以做

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