我们经常会在某个table末尾加上操作列来放置button来处理跳转和其他的逻辑

那么当点击button的时候同样也会执行在el-table 设置的 @row-click="handleRowClick"事件。如果避免这种情况呢？

其实很简单，在操作列的加上@click.stop就可以了

<el-table @row-click="handleRowClick :data="dataList">

       <el-table-column header-align="left" align="left" label="操作">

            <template slot-scope="scope">

              <el-button

                size="mini"

                type="text"

                @click.stop

                @click="handleView(scope.row)"

              >查看</el-button>

              <el-button

                v-else

                size="mini"

                @click.stop

                @click="handleProcess(scope.row)"

              >处理</el-button>

            </template>

        </el-table-column>

<el-table>

这样就可以避免执行handleRowClick事件了

Vue element-ui el-table阻止行选事件的更多相关文章

  1. vue + element ui 阻止表单输入框回车刷新页面

    问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...

  2. Vue+element ui table 导出到excel

    需求: Vue+element UI table下的根据搜索条件导出当前所有数据 参考: https://blog.csdn.net/u010427666/article/details/792081 ...

  3. vue + element ui 表格自定义表头，提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  4. vue+element ui 的tab 动态增减，切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  5. vue + element ui 实现实现动态渲染表格

    前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...

  6. vue+element ui 的表格列使用组件

    前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ...

  7. vue+element ui 的时间控件选择 年月日时分

    前言:工作中用到 vue+element ui 的前端框架,需要选择年月日时分,但element ui官网demo有没有,所以记录一下.转载请注明出处:https://www.cnblogs.com/ ...

  8. Vue+Element UI 实现视频上传

    一.前言 项目中需要提供一个视频介绍,使用户能够快速.方便的了解如何使用产品以及注意事项. 前台使用Vue+Element UI中的el-upload组件实现视频上传及进度条展示,后台提供视频上传AP ...

  9. 分享一个自搭的框架，使用Spring boot+Vue+Element UI

    废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...

  10. Vue + Element UI 实现权限管理系统

    Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html

随机推荐

  1. Arcgis api for js实现服务端地图的增删改查

    < !DOCTYPE html > <html xmlns = "http://www.w3.org/1999/xhtml" > <head > ...

  2. express中是如何处理IP的?

    express获取client_ip req.ip // 获取客户端ip req.ips // 获取请求经过的客户端与代理服务器的Ip列表 查看源码 定义获取ip的入口, // 源码 request. ...

  3. 题解 CF296B 【Yaroslav and Two Strings】

    题目 传送门 题目大意 如果两个只包含数字且长度为 \(n\) 的字符串 \(s\) 和 \(w\) 存在两个数字 \(1≤i,j≤n\),使得 \(s_i<w_i,s_j>w_j\) , ...

  4. ES6标准中的import和export

    在ES6前, 前端使用RequireJS或者seaJS实现模块化, requireJS是基于AMD规范的模块化库,  而像seaJS是基于CMD规范的模块化库,  两者都是为了为了推广前端模块化的工具 ...

  5. python-多任务编程01-线程(threading)

    并发:指的是任务数多余cpu核数,通过操作系统的各种任务调度算法,实现用多个任务“一起”执行(实际上总有一些任务不在执行,因为切换任务的速度相当快,看上去一起执行而已) 并行:指的是任务数小于等于cp ...

  6. PHP中interface的用处

    确实,PHP 接口是有它的目的的.   它们是契约,是给其他开发人员的说明手册.然而,还是很难理解接口有什么用.   基础 接口是抽象的类,无法直接实例化,但是可被实现.   这是一个基本的例 int ...

  7. Java8线程池ThreadPoolExecutor底层原理及其源码解析

    小侃一下 日常开发中, 或许不会直接new线程或线程池, 但这些线程相关的基础或思想是非常重要的, 参考林迪效应; 就算没有直接用到, 可能间接也用到了类似的思想或原理, 例如tomcat, jett ...

  8. STL入门－－sort,lower_bound,upper_bound,binary_search及常见错误

    首先,先定义数组 int a[10]; 这是今天的主角． 这四个函数都是在数组上操作的 注意要包含头文件 #include<algorithm> sort: sort(a,a+10) 对十 ...

  9. 在CentOS 7 上为docker配置端口转发以兼容firewall

    在CentOS 7上当我们以类似下列命令将主机端口与容器端口映射时可能遇到无法访问容器服务的问题 docker run --name web_a -p 192.168.1.250:803:80 -d ...

  10. SQL Server 枚举异或运算后值存入数据库，读取符合条件的值

    有枚举如下: [Flags] public enum Color { Red = , Green = , Blue = , White = } 定义三个枚举变量,并将值存入数据库: Color col ...