bindtap和catchtap
看了小程序视频,了解到了微信小程序的冒泡机制,bindtap和catchtap的区别,在这里做一下笔记。
为了直观表示,我在这里用一个例子说明:
<view>
<swiper catchtap='onSwiperTap'>
<swiper-item>
<image bindtap='onSwiperItemTap' src='1.png' data-postId='1'></image>
</swiper-item>
<swiper-item>
<image src='2.png' data-postId='2'></image>
</swiper-item>
<swiper-item>
<image src='3.png' data-postId='3'></image>
</swiper-item>
</swiper>
</view>
冒泡机制就是如果点击image组件,会依次触发swiper-item→swiper→view。
catchtap可以阻止冒泡,在swiper中用catchtap绑定事件,就不用继续往view那一层冒泡了,bindtap是不会阻止冒泡的,在image组件中用bindtap绑定事件,在代码执行过程中,点击image组件,不仅会触发onSwiperItemTap,还会向上一步触发onSwiperTap。
target和currentTarget
target指的是当前点击的组件,currentTarget指的是事件捕获的组件
具体到上面例子中target指的是image组件,这里面有postId,而currentTarget指swiper组件,里面并没有postId传进来