讲述以下微信小程序中的冒泡事件和非冒泡

<!--事件 -->

<viewid='outter'bindtap="outterTap">

outter

<viewid='middle'bindtap='middleTap'>

middle

<viewid='inner' bindtap='innerTap'>

inner

</view>

</view>

</view>

test.js

innerTap:function(){

console.log('inner事件')

},

middleTap:function(){

console.log('middleTap事件')

},

outterTap:function(){

console.log('outterTap事件')

}

我们在js中把每个事件写下来看看都打印出什么inner-》middle-》outter

会发现当点击最里面的inner时，举个例子就和水泡一样从里到外进行执行 一次显示:inner事件、middleTap事件、outterTap事件，当点击middle时

会一次提示middleTap事件、inner事件。这就是典型的冒泡事件

我们如何在小程序中来阻止冒泡呢接下来我们在演示一下。这回我们在对应的id中增加一个catchtap属性进行阻止冒泡

<view id='outter' bindtap="outterTap">

outter

<view id='middle' catchtap='middleTap'>

middle

<view id='inner' catchtap='innerTap'>

inner

</view>

</view>

</view>

这样我当我们对inner执行点击时，父级和爷爷不会触发。

当一个事件被触发后，他会向他父节点进行传递 这就是所谓的冒泡

当一个事件被触发后，他不会向他的父节点进行传递 这就是非冒泡/阻止冒泡