您的位置:首页 > 教育 > 锐评 > cad二次开发_网络舆情监测报告_google浏览器下载安装_手机百度官网首页

cad二次开发_网络舆情监测报告_google浏览器下载安装_手机百度官网首页

2025/3/12 8:56:26 来源:https://blog.csdn.net/qq_37388085/article/details/146106243  浏览:    关键词:cad二次开发_网络舆情监测报告_google浏览器下载安装_手机百度官网首页
cad二次开发_网络舆情监测报告_google浏览器下载安装_手机百度官网首页

在微信小程序中,事件分为 冒泡事件非冒泡事件

冒泡事件:当一个组件的事件被触发后,该事件会向父节点传递;(如果父节点中也绑定了一个事件,父节点事件也会被触发,也就是说子组件的事件和父组件的事件都会被触发);

非冒泡事件:当一个组件的事件被触发后,该事件不会向父节点传递;(如果父节点绑定了事件,父节点的事件不会被触发,只有组件本身的事件会触发);

在微信小程序中,使用 bind 绑定的事件,会触发事件冒泡,如果想阻止事件冒泡,可以使用 catch 来绑定事件;

下面使用微信开发者工具来演示一下,在基于上一节的内容下进行演示,在 pages/cate/cate.wxml 中添加以下代码:

<view class="catch" bind:tap="parentHandler"><button bind:tap="btnHandler">按钮</button>
</view>

在 pages/cate/cate.scss 中添加以下样式代码:

.catch {display: flex;height: 300rpx;background-color: skyblue;align-items: center;
}

在 pages/cate/cate.js 中添加以下函数:

Page({parentHandler(){console.log('父组件绑定的事件')},btnHandler(){console.log('子组件触发的事件')}
})

编写完毕后,点击重新编译,点击页面的按钮,可以看到子组件和父组件绑定的事件都触发了,如下:

在这里插入图片描述
如果想实现点击子组件按钮的时候,只触发子组件的事件,父组件的事件不触发,则需要阻止子组件的事件冒泡;如果想阻止子组件的事件冒泡,就需要更改一下绑定事件的方式,我们需要把子组件绑定事件的方式从 bind:tap 修改为 catch:tap,如下:

<view class="catch" bind:tap="parentHandler"><button catch:tap="btnHandler">按钮</button>
</view>

重新运行,点击按钮,可以发现父组件的事件没有触发,如下:

在这里插入图片描述
参考视频:尚硅谷微信小程序开发教程

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com