在 pages 下的 index.wxml 文件里面写主体框架

    
        爷爷    
     
              父亲        
      
                  儿子        
          
     
    绑定相同的事件点击 view3 的时候会触发 view2 和 view1  如果想阻止冒泡在 view3 上用 catchtap 事件来绑定就好了 复制代码

在 pages 下的 index.js文件里面设置操作逻辑

//事件处理函数   //  说说 event 里面几个重要的属性 currentTarget 绑定事件 target 可以查看到时触发事件源，其中在 currentTarget 里面有个属性叫 dataset 可以显示自己手动添加的数据例如 data-title = '我是标题' 最后  "我是标题"  会在 dataset  中显示出来    view1Click :function(event){        console.log('view1Click');        console.log(event);    },    view2Click :function(){        console.log('view2Click')    },    view3Click :function(event){        console.log('view3Click');        console.log(event)    },复制代码

在 pages 下的 index.wxss 文件里面设置样式

.view1{  height:500rpx;  width:100%;  background-color: red; } .view2{  height:300rpx;  width:80%;  background-color: green; } .view3{  height:100rpx;  width:50%;  background-color: yellow; }复制代码