微信小程序--catchtap&bindtap

Posted 2020-10-25 herizai

微信小程序--catchtap&bindtap

转自：https://www.cnblogs.com/heron-yu/p/7244481.html

转自：http://blog.csdn.net/xiaochun365/article/details/69948578

bindtap元素绑定事件，父节点绑定事件会冒泡

catchtap不会冒泡，仅在当前元素触发

//wxml

<view class="view1" bindtap="view1">
  <view class="view2" bindtap="view2">
    <view class="view3" catchtap="view3"></view>
  </view>
</view>

//js

Page({
  data: {
  }, view1: function () {
    console.log("---view1 bindtap click")
  }, view2: function () {
    console.log("--view2 bindtap click")
  }, view3: function () {
    console.log("-view3 catchtap click ")
  }
})

//点击view3

-view3 catchtap click 

//点击view2

--view2 bindtap click
---view1 bindtap click

//点击view1

---view1 catchtap click 

点击view1,因为是bindtap他会向父节点传递,因为他本身没有父节点所以只打印的view1 bindtap click