Vue:Table在点击删除的时候阻止行点击事件

目录

    • [一、 出现场景](#一、 出现场景)
    • [二、 解决方案](#二、 解决方案)

一、 出现场景

问题:给el-table绑定行点击事件row-click,点击行时,触发表格的行点击事件,可是表格中有操作列,列中有其他点击事件,比如编辑和删除,此时点击编辑事件,也会触发表格的行点击事件了

二、 解决方案

在操作列的 @click 事件时添加 .stop

html 复制代码
 <el-table-column  label="操作" >
    <template slot-scope="scope">
      <el-button type="text"  @click.stop="handleDelete(scope.row)">删除</el-button>
    </template>
 </el-table-column>
相关推荐
朴shu2 分钟前
Delta数据结构:深入剖析高效数据同步的奥秘
javascript·算法·架构
该用户已不存在5 分钟前
Vibe Coding 入门指南:从想法到产品的完整路径
前端·人工智能·后端
Pedro10 分钟前
Flutter - 日志不再裸奔:pd_log 让打印有型、写盘有序
前端·flutter
申阳10 分钟前
Day 3:01. 基于Nuxt开发个人呢博客项目-初始化项目
前端·后端·程序员
三小河15 分钟前
解决 React + SSE 流式输出卡顿:Nginx 关键配置实战
前端·架构·前端框架
玖月晴空24 分钟前
Uniapp 速查文档
前端·微信小程序·uni-app
琉-璃26 分钟前
vue3+ts 任意组件间的通信 mitt的使用
前端·javascript·vue.js
FogLetter1 小时前
React Fiber 机制:让渲染变得“有礼貌”的魔法
前端·react.js
不想说话的麋鹿1 小时前
「项目前言」从配置程序员到动手造轮子:我用Vue3+NestJS复刻低代码平台的初衷
前端·程序员·全栈
JunpengHu1 小时前
esri-leaflet介绍
前端