阻止小程序事件冒泡的三种方法

1.直接用方法 :catchtouchmove=“preventD”

<view class="selector-bj {{isTapSelector ? '' : 'is-focus-selector' }}"
	wx:if="{{selectorBj}}" bindtap='tapSeleBj' catchtouchmove="preventD">
</view>
	//防止点击穿透 背景层
	preventD:function(){
	},

2. 使用 catch 不用bind (个人喜欢这个方法)

bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡。

如在下边这个例子中,点击 inner view 会先后调用handleTap3和handleTap2(因为tap事件会冒泡到 middle view,而 middle view 阻止了 tap 事件冒泡,不再向父节点传递),点击 middle view 会触发handleTap2,点击 outer view 会触发handleTap1。

<view id="outer" bindtap="handleTap1">
  outer view
  <view id="middle" catchtap="handleTap2">
    middle view
    <view id="inner" bindtap="handleTap3">
      inner view
    </view>
  </view>
</view

3.在方法最后加上return false。

在小程序可以查看跟多前端面试题

在这里插入图片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章