ElementUi <el-table>中按钮点击操作阻止@row-click点击
<el-table> 添加@row-click点击行时,会跳转到一个详细信息页面, 但是同时这一行也有编辑和删除类似其他的点击按钮。
遇到问题: 在点击按钮时,@row-click事件也被触发了,而我并不想触发 row-click 事件
解决办法: 写按钮的 @click 事件时添加 .stop
1 2 3 4 5 6 7 8 9 10 11 12 13 | <el-table :data= "list.data" class = "el-table-style elTable" @row-click= "handleEdit" > <el-table-column align= "center" label= "No." width= "60" > <template slot-scope= "scope" > <div class = "staffNo" > <div class = "sId" >{{ scope.row.id }}</div> <div class = "sortStyle" > <span v- if = "scope.$index !== 0" class = "up" @click.stop= "handleMoveUp" ></span> <span v- if = "scope.$index !== list.data.length-1" class = "down" @click.stop= "handleMoveDown" ></span> </div> </div> </template> </el-table-column> </el-table> |
吾日三省吾身,脚踏实地~
分类:
Element-UI
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 地球OL攻略 —— 某应届生求职总结
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 提示词工程——AI应用必不可少的技术
· .NET周刊【3月第1期 2025-03-02】