3.小程序-事件绑定

事件分类
    1.冒泡事件
        冒泡事件,当一个组件上的事件被触发后,该事件向父节点传递;
    2.非冒泡事件
        冒泡事件,当一个组件上的事件被触发后,该事件不会向父节点传递;
绑定事件
    1.bind 绑定;不可以阻止冒泡事件
    2.catch 绑定;可以阻止冒泡事件
 
index.js 文件中的代码展示:
// 在小程序里定义的事件函数和生命周期函数同级
handleParent(){
    console.log('parent')
},
handleChild(){
    console.log('child')
},

index.wxml文件中的代码展示:

<view class="indexContainer">
    <image class="avatarUrl" src="/static/images/nvsheng.jpg"></image>
    <text class="userName">G『 s 』</text>
    <view class="goStudy" catchtap="handleParent">  // 也可以使用 bindtap,会触发冒泡事件,即由子到父,有里到外
        <text catchtap="handleChild">{{message}}</text>
    </view>
</view>
扩展内容
    1.事件流的三个阶段:
        1.捕获:从外向内
        2.执行目标阶段
        3.冒泡:从内向外
 
官网位置:指南--->小程序框架--->视图层--->事件系统
posted @ 2021-03-16 16:18  以赛亚  阅读(55)  评论(0编辑  收藏  举报