bindtap和catchtap的区别

今天在研究小程序，突然看到catchtap，立即决定明白是干嘛的

 

bindtap和catchtap都是点击事件触发函数

不同点，我写了两个例子来方便大家理解

例一：

<view id="outer" bindtap="outer">
  outer view
  <view id="middle" bindtap="middle">
    middle view
    <view id="interior" bindtap="interior">
      interior view
    </view>
  </view>
</view>



outer (e) {
  console.log('--outer bindtap click')  
  //内容为：--outer bindtap click
},
middle (e) {
  console.log('--middle bindtap click') 
  // 内容为--middle bindtap click  --outer bindtap click
},
interior (e) {
  console.log('--interior bindtap click') 
  //内容为：--interior bindtap click --middle bindtap click --outer bindtap click
},

上面例子用的都是bindtap，从打印出来的数据可以看到，bindtap是冒泡的

例二：

<view id="outer" catchtap="outer">
  outer view
  <view id="middle" catchtap="middle">
    middle view
    <view id="interior" catchtap="interior">
      interior view
    </view>
  </view>
</view>


outer (e) {
  console.log('--outer bindtap click')  //打印出来的内容为：--outer bindtap click
},
middle (e) {
  console.log('--middle bindtap click') // 打印出来的内容为： --middle bindtap click
},
interior (e) {
  console.log('--interior bindtap click') //打印出来的内容为：--interior bindtap click
},

上面的例子用的是catchtap，从打印数据可以看出catchtap是非冒泡的

 

不知道大家理解了没有\(^o^)/~