## 事件冒泡 [TOC] ### 事件分类 事件分为冒泡事件和非冒泡事件： 1.冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。 2.非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递。 ### 绑定事件：bindtap、catchtap >`bindtap`无法阻止事件冒泡 `catchtap`可以阻止事件冒泡 关于[事件冒泡](https://www.kancloud.cn/lixu/h5-learning-special/760212#09_165)在JavaScript中有解释 ### target、与currentTarget >`target`指正在被点击的组件 `currentTarget`指被事件捕获的组件 #### 例 ##### wxml ``` <view class="parent" catchtap="parent" data-title="parnet"> <view class="child" data-title="child"></view> </view> ``` ##### wxss ``` .parent{ width: 100rpx; height: 100rpx; background: red; } .child{ width: 50rpx; height: 50rpx; background: yellow; } ``` ##### js ``` Page({ data:{ child:"child" }, parent(event){ console.log(event.target.dataset.title); console.log(event.currentTarget.dataset.title); }, child(event){ console.log("child"); } }) ```