小程序中子元素点击事件不触发父元素的点击事件处理
2023-01-12 本文已影响0人
陈大帅
当子元素和父元素都有点击事件时,点击子元素事件的时候会触发父元素的点击事件,从而执行父级的点击事件,跳转到了父级的点击事件的页面了,怎么解决这个问题呢?
如下图:
只需要把子级的bindtap改成catchtap,就可以了
<navigator wx:for="{{goodsList}}" wx:key="gIdx" url="******">
<image src="*****" mode="heightFix" catchtap="onClickAddCart" data-index="{{gIdx}}"/>
</navigator>
因为:
bind事件绑定不会阻止冒泡事件向上冒泡
catch事件绑定可以阻止冒泡事件向上冒泡
当点击子集的catchtap=''事件之后阻止冒泡事件向上冒泡,所以不会触发bindtap='',成功解决bug,实现小程序中点击子元素事件而不触发父元素的点击事件。