美文网首页
小程序中子元素点击事件不触发父元素的点击事件处理

小程序中子元素点击事件不触发父元素的点击事件处理

作者: 陈大帅 | 来源:发表于2023-01-12 16:34 被阅读0次

    当子元素和父元素都有点击事件时,点击子元素事件的时候会触发父元素的点击事件,从而执行父级的点击事件,跳转到了父级的点击事件的页面了,怎么解决这个问题呢?

    如下图:

    QQ20230113-162722@2x.png

    只需要把子级的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,实现小程序中点击子元素事件而不触发父元素的点击事件。

    相关文章

      网友评论

          本文标题:小程序中子元素点击事件不触发父元素的点击事件处理

          本文链接:https://www.haomeiwen.com/subject/bzrwcdtx.html