uniapp微信小程序中阻止事件冒泡

开发场景:列表中展示地块的数据信息,用户可以点击列表进入地块的详情界面,也可以点击列表中的星星按钮进行收藏

遇到的问题:每次点击星星的时候,都会触发父级的点击事件,从而进入到详情界面

原本的代码:

我原本想到可以使用**@click.stop**用来阻止时间冒泡,但是根本不管用

后来查阅了下相关的资料

在uniapp的官网也有相关的记录 uniapp官网小程序内阻止事件冒泡

才发现在uniapp解决微信小程序的阻止时间冒泡应该使用**@tap.stop**

javascript 复制代码
@tap.stop="changeCondition(index,item,item.condition)"></u-icon>

这样就可以完美解决这个问题啦

最后 说一下uniapp中@tap和@click两者的区别:

  1. @click是组件被点击时触发,会有约200-300ms的延迟;
  2. @tap是手指触摸离开时触发,没有300ms的延迟,但是会有事件穿透;
相关推荐
kyriewen1 小时前
程序员连夜带团队跑路,省了23万:这AI太贵,真的用不起了
前端·javascript·openai
kyriewen2 小时前
你写的代码没有测试,就像出门不锁门——Jest + Testing Library 从入门到不慌
前端·单元测试·jest
yuzhiboyouye3 小时前
web前端英语面试
前端·面试·状态模式
:mnong3 小时前
附图报价系统设计分析5
electron·pdf·vue·cad·dwg·定额
canonical_entropy4 小时前
下一代低代码渲染框架 nop-chaos-flux 的设计原则
前端·低代码·前端框架
东方小月4 小时前
5分钟搞懂Harness Engineering(驾驭工程):从提示词到AI Agent的进化之路
前端·后端·架构
我叫黑大帅4 小时前
为什么需要 @types/react?解决“无法找到模块 react 的声明文件”报错
前端·javascript·面试
之歆4 小时前
DAY_21JavaScript 深度解析:数组(Array)与函数(Function)(一)
前端·javascript
XinZong5 小时前
【AI社交】基于OpenClaw自研轻量化AI社交平台实战
前端
Le_ee5 小时前
ctfweb:php/php短标签/.haccess+图片马/XXE
开发语言·前端·php