描述:<el-table> 点击行时,会跳转到一个详细信息页面, 但是同时这一行也有编辑和删除按钮。

问题: 在点击按钮时,@row-click事件也被触发了,而我并不想触发 row-click 事件

解决办法: 写按钮的 @click 事件时添加 .stop

<el-button type="text" @click.stop="deleteVisible = true"><i class="el-icon-delete el-icon--right"></i></el-button>

参考:https://blog.csdn.net/qq_36437172/article/details/88779425

element-ui : <el-table> 按钮点击操作阻止@row-click的更多相关文章

  1. (Element UI 组件 Table)去除单元格底部的横线

    Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线. 这个底部横线其实是一个 b ...

  2. element ui的 el-dropdown-item标签点击事件

    在vue项目中使用element的el-dropdown-item标签时 给标签添加click事件 初始时按照正常写法 <el-dropdown-item @click="click( ...

  3. Element UI的Table用法

    Table 表格 用于展示多条结构类似的数据,可对数据进行排序.筛选.对比或其他自定义操作. ¶基础表格 基 2016-05-02 王小虎 上海市普陀区金沙江路 1518 弄 2016-05-04 王 ...

  4. Element Ui中table实现表格编辑效果

    主要以css实现 .tb-edit .el-input, .tb-edit .el-input-number, .tb-edit .el-select { display: none; width: ...

  5. JS判断键盘是否按的回车键并触发指定按钮点击操作

    document.onkeydown = function (e) { if (!e) e = window.event; if ((e.keyCode || e.which) == 13) { va ...

  6. element ui里面table分页,页数从0开始的怎么做?

    需求: 后台请求的接口是从0页开始的,但是pagination是从1开始的,就是在点击pagination的第1页是后台转0 1首先在data里面定义为1,其他地方也是定义1 return { for ...

  7. element ui 合计/table show-summary

    在el-table 上面加上show-summary就可以对table的数据进行合计 但是上次出现了合计栏有的为空,有的合计不对的情况,如果出现的是空,那么说明你渲染的数据有undefine(即后台返 ...

  8. 怎么样使element ui 的table某列变色

    第一步.在el-table里面加上:row-style="rowClass" <el-table :data="targetCarList" border ...

  9. element ui的table的头部自定义

    <el-table-column label="级别" min-width="120" prop="clueLevel" align= ...

随机推荐

  1. UbuntuServer 16.04 with LNMP搭建WordPress

    前几天弄了个腾讯云服务器,一时新鲜,就想着在上面搭建一个wordpress博客,前后搞了四五天,各种度娘谷歌,各种错误,不过还好,最终总算是被我搭建出来了!不啰嗦,书归正传,下面开始搭建! 目录: 一 ...

  2. Mongodb操作之查询(循序渐进对比SQL语句)(转http://www.tuicool.com/articles/UzQj6rF)

    工具推荐:Robomongo,可自行百度寻找下载源,个人比较推荐这个工具,相比较mongoVUE则更加灵活. 集合简单查询方法 mongodb语法:db.collection.find()  //co ...

  3. 十四、curator recipes之DistributedAtomicLong

    简介 和Java的AtomicLong没有太大的不同DistributedAtomicLong旨在分布式场景中维护一个Long类型的数据,你可以像普通单机环境一样来使用它. 官方文档:http://c ...

  4. memcached 细究(二)

    { CentOS ping命令 分布式部署服务器时用到ping命令 #ping -c 4 192.168.16.1 //ping4次后结束. }   使用telnet 查看memcached 运行状态 ...

  5. 撩课-Python-每天5道面试题-第9天

    一. Python程序中, 文件的处理步骤是什么? 打开 open("文件","模式") 读写 2.1 读 f.read(字节数) 字节数默认是文件内容长度 下 ...

  6. 对JDK、JRE和JVM的一些浅薄理解

    JDK:JDK(Java Development Kit),顾名思义是java程序的开发包,任何java程序想要运行都需要相应版本的JDK,可以到oracle下载(下载之后自带JRE和编译工具等,无需 ...

  7. HTML骨架详解

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. CenOs7安装oracle图文详细过程(02)

    原创作品,转载请在文章头部(显眼位置)注明出处:https://www.cnblogs.com/sunshine5683/p/10011574.html 8.修改用户限制 vim /etc/secur ...

  9. LintCode2016年8月22日算法比赛----平面列表

    平面列表 题目描述 给定一个列表,该列表中的每个要素要么是个列表,要么是整数.将其变成一个只包含整数的简单列表. 注意事项 如果给定的列表中的要素本身也是一个列表,那么它也可以包含列表. 样例 给定 ...

  10. Google APAC----Africa 2010, Qualification Round(Problem A. Store Credit)----Perl 解法

    原题地址链接:https://code.google.com/codejam/contest/351101/dashboard#s=p0 问题描述: Problem You receive a cre ...