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>
相关推荐
阿四几秒前
【Nextjs】为什么server action中在try/catch内写redirect操作会跳转失败?
前端·next.js
申阳3 分钟前
Day 6:04. 基于Nuxt开发博客项目-LOGO生成以及ICON图标引入
前端·后端·程序员
中国lanwp15 分钟前
npm中@your-company:registry 和 registry 的区别
前端·npm·node.js
Bacon17 分钟前
Electron 应用商店:开箱即用工具集成方案
前端·github
行走的陀螺仪18 分钟前
uni-app + Vue3 实现折叠文本(超出省略 + 展开收起)
前端·javascript·css·uni-app·vue3
冴羽21 分钟前
JavaScript 异步循环踩坑指南
前端·javascript·node.js
小禾青青22 分钟前
uniapp安卓打包遇到报错:Uncaught SyntaxError: Invalid regular expression: /[\p{L}\p{N}]/
android·uni-app
jump68022 分钟前
commonjs 和 ES Module
前端
旧曲重听144 分钟前
前端需要掌握多少Node.js?
前端·node.js
Mr.Jessy1 小时前
Web APIs 学习第四天:DOM事件进阶
开发语言·前端·javascript·学习·ecmascript