RN 事件穿透pointerEvents

本文介绍了如何使用CSS3中的pointer-events属性实现事件穿透效果。通过设置pointer-events为none,可以使鼠标事件穿过上层元素直接作用于下层元素,这对于解决复杂的DOM结构中交互设计问题非常有用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

有时需要点击上层组件触发下层组件的操作,就要用到事件穿透,

之前写web知道pointer-events

pointer-events是CSS3中又一冉冉的属性,其支持的值牛毛般多,不过大多都与SVG相关,我们可以不用理会。当下,对于偶们来讲,与SVG划开界线值得一提的就是[none|auto]两个属性值了。其中”auto”的感觉与width属性的”auto”类似,一般在一些特殊场合露一手,平时闺门不出,没什么说头。因此,一轮筛选下来,我们需要留意的只是pointer-events:none而已。

pointer-events:none是个很有意思的东西,某些情况下其精湛的表现会让人两眼发光。

pointer-events:none顾名思意,就是鼠标事件拜拜的意思。元素应用了该CSS属性,链接啊,点击啊什么的都变成了“浮云牌酱油”。

RN中同样有这个属性
 

<View pointerEvents={'none'} />

在你要穿透的元素上加上pointerEvents={'none'}即可!

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值