微信小程序自定义组件阻止click事件冒泡

最新推荐文章于 2025-05-26 16:10:50 发布

u011010407

最新推荐文章于 2025-05-26 16:10:50 发布

阅读量517

点赞数 4

CC 4.0 BY-SA版权

文章标签：微信小程序小程序

本文链接：https://blog.csdn.net/u011010407/article/details/147562869

怎么说呢，官方没有找到类似js的阻止冒泡的方法，网上的 stopPropagation 和 return false全部阵亡。

不过可以通过 catch:tap 代替 bind:tap 可是，如果我的场景是这样子，该怎么办呢：

写了一个img组件。这个组件有一个预览参数，点击img后进入组件内部事件预览图片。
但是在其他场景，这个img只是为了显示一个ico，需要在页面上点击后做跳转怎么办。

这个时候只能找到能够在img自定义组件中的阻止冒泡的事件。

最终在官方文档找到了一线生机，就是我先使用catch:tap，然后在处理在这里插入代码片函数中手动发射tap事件。注意需要设置允许冒泡。

完整代码

<image catch:tap="click"></image>

function click(event){
	if (!this.data.preview) {
		var myEventDetail = {} // detail对象，提供给事件监听函数
		var myEventOption = { bubbles: true } // 触发事件的选项
		this.triggerEvent('tap', myEventDetail, myEventOption)
		return;
	}
	wx.previewImage({
		urls: [this.data.fullSrc],
 	})
}