微信小程序中的事件
1、打开小程序开发工具，在项目pages目录新建myIndex文件夹，并在此文件夹下新建page，名为mypage，在app.json配置文件中将mypage设为第一页面
2、在mypage.wxml中写代码如下，布局三个嵌套的view
<view bindtap='view1tap' class='view1' id ='view1'>
<view bindtap='view2tap' class='view2' id = 'view2'>
<view bindtap='view3tap' class='view3' id='view3'>
</view>
</view>
</view >
3、为方便显示，在mypage.wxss中给三个view添加背景颜色的属性，代码如下：
.view1{
width: 100%;
height: 200rpx;
background-color: red;
}
.view2{
width: 50%;
height: 100rpx;
background-color: blue;
}
.view3{
width: 50%;
height: 50rpx;
background-color: wheat;
}
4、在mypage.js中为三个view添加tap事件的处理函数，代码如下：
view1tap:function(){
console.log('view1 click');
},
view2tap:function(){
console.log('view2 click');
},
view3tap: function () {
console.log('view3 click');
}
5、编译运行代码，在右侧的模拟器点击view3最小的view，在右侧console中会发现页触发view2和view3的bindtap的响应方法，这称为事件的冒泡
6、为阻止事件的冒泡，使用catchtap来绑定事件，更改mypage.wxml代码如下：
<view bindtap='view1tap' class='view1' id ='view1'>
<view bindtap='view2tap' class='view2' id = 'view2'>
<view catchtap='view3tap' class='view3' id='view3'>
</view>
</view>
</view >
7、再次编译运行代码，点击view3时console就只会打印出view3点击的消息了
