uniapp中switch和select组件阻止chane事件冒泡的方法

在uni-app中,‌处理事件冒泡通常使用.stop修饰符来阻止事件冒泡。‌如果你想要在使用switch或select组件时阻止change事件冒泡,‌你可以在模板绑定事件时添加.stop修饰符。‌

示例

使用switch组件

html

Copy Code

<switch @change.stop="switchChange" />

使用select组件(‌假设是一个自定义组件或类似行为)‌

html

Copy Code

<select @change.stop="selectChange">

Option 1

Option 2

注意

确保.stop修饰符紧跟在事件名之后,‌中间不要有空格。‌

如果.stop修饰符不起作用,‌可能是因为特定的组件或框架版本有差异,‌此时建议查看最新的官方文档或寻求社区的帮助。‌

在使用自定义组件时,‌确保自定义组件内部也正确处理了事件冒泡,‌否则可能需要在组件内部也使用.stop。‌

以上方法不好用时可以试试:

给需要change的标签父级元素加上 @tap.stop.prevent

javascript 复制代码
<view @tap.stop.prevent>
							<view><switch :checked="scope.row.status" @change="event=>switchChangeStatus(event, scope.row)" /></view>
							<el-button link type="primary" size="small"@click="delZzp(scope.row)">删除</el-button>
						</view>
相关推荐
瑞瑞小同学1 小时前
处理echarts x轴内容过多,重叠问题
前端·javascript·echarts
HexCIer1 小时前
面向未来的原子化 CSS:UnoCSS 核心架构分析与 Tailwind CSS 现状
前端·css·vite
程序员黑豆2 小时前
鸿蒙应用开发中的单位详解:px、vp、fp、lpx
前端·harmonyos
像我这样帅的人丶你还2 小时前
MCP + npm:给五年前的老系统接上AI
前端·javascript·agent
南一Nanyi2 小时前
依赖注入和控制反转
前端·设计模式·nestjs
小村儿2 小时前
连载14-实战篇--一个半月,我一个人和 Claude Code 搭出一套数字人工程
前端·后端·ai编程
愚公移码2 小时前
蓝凌EKP18产品:流程虚拟机(PVM)
java·开发语言·前端
promiseThen3 小时前
5 分钟上手 Markdown:标题到表格、代码块与简历实战
前端
web66liang3 小时前
webpack4+vue2项目使用 sass-embedded 导致的 DockerfIle 构建失败的问题
前端
Strayer3 小时前
拓扑管网 3D 可视化大屏demo:科技感(地图 + 拓扑 + 3D 空间)
前端·three.js·数据可视化