vue+ element table如何给指定的单元格添加点击事件?
今天使用vue,以及element-ui这个框架时,发现业务需要在表格里加一个连接跳转,当时立刻打开element的官网,进行查看http://element-cn.eleme.io/#/zh-CN/component/table是在<el-table>里进行添加事件的,而此时我进行尝试后发现这个是每一个单元格都需要跳转,不是我想要的针对某一列进行的点击跳转操作,于是各种技术贴开始搜索,最后发现一个网友的写法很可行。
我把参考网站贴出来https://segmentfault.com/q/1010000012511902
<el-table-column prop="goods_count" label="活动兑换商品" align="center" width="150" >
<template slot-scope="scope">
<el-button type="text" size="small" @click="handleGoods(scope.row)" v-if="scope.row.goods_count==0">管理活动商品</el-button>
<el-button type="text" size="small" @click="handleGoods(scope.row)" v-else>{{scope.row.goods_count}}</el-button>
</template>
</el-table-column>
handleJoinGoods(row,id){
console.log(row.goods_count); }
其中<el-button>也可以换成别的你想要的标签,都是没有问题的。好了 这样问题就解决啦!
vue+ element table如何给指定的单元格添加点击事件?的更多相关文章
- 点击表格的单元格时实现变颜色,通过for循环为每个单元格添加一个onclick事件
<title>无标题文档</title> <script type="text/javascript" language="javascri ...
- 27.openpyxl 向指定单元格添加图片并修改图片大小 以及修改单元格行高列宽
openpyxl 向指定单元格添加图片并修改图片大小 以及修改单元格行高列宽 from openpyxl import Workbook,load_workbook from openpyxl.dra ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格:为所有表格的单元格添加边框
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 在Excel里用vba给合并的单元格添加注释
Excel里使用VBA对已经合并的单元格添加注释,直接使用AddComment会报: 运行时错误 '1004':应用程序定义或者对象定义错误 找了很多文章都没找到怎么解决,最后发现在AddCommen ...
- POI单元格添加公式以及读取公式结果的值
POI提供了为单元格添加条件样式的方法,但是我并没有找到获取单元格改变后样式的方法,获取到样式依旧是没有改变之前的. 比如为单元格添加条件样式用于监听单元格值是否被修改,如果单元格值被修改那么字体颜色 ...
- C# DataGridView中指定的单元格不能编辑
注意:DataGridView控件是从.NET Framework 2.0版本开始追加的. ReadOnly属性的使用 DataGridView内所有的单元格不能编辑 当DataGridView.Re ...
- 使用POI设置导出的EXCEL锁定指定的单元格
注:要锁定单元格需先为此表单设置保护密码,设置之后此表单默认为所有单元格锁定,可使用setLocked(false)为指定单元格设置不锁定. sheet.protectSheet("&quo ...
- 在excel 中某一单元格添加指定字符的示例
="select TestSurveyID,'http://www.findoout.cn/survey/viewsurvey.aspx?tid='+CONVERT(varchar(10), ...
- element-ui 格式化树形数组在table组件中展示(单元格合并)
最近做的项目涉及到很多单元格合并问题,element-ui组件对于单元格合并的处理虽然很灵活,但是需要事先计算好每个单元格合并的rowspan和colspan,直接在span-method属性中计算实 ...
随机推荐
- [转]Nginx实现高并发的原理
Nginx 首先要明白,Nginx 采用的是多进程(单线程) & 多路IO复用模型.使用了 I/O 多路复用技术的 Nginx,就成了”并发事件驱动“的服务器. 异步非阻塞(AIO)的详解ht ...
- 解决android sdk docs帮助文档打开慢的问题
解决android sdk docs帮助文档打开慢的问题 转https://blog.csdn.net/yang5726685/article/details/80543849 经查是因为本地文档中的 ...
- React里单页面div自适应浏览器高度占满屏幕
可以用绝对定位方式,让div占满屏幕,css样式如下: height: 100%; width: 100%; position: absolute; top: 0px; bottom: 0px;
- MongoDB in Action (MongoDB 实战).pdf
http://www.open-open.com/doc/view/691d4d2232ce4b30b14c6b218fff4be8
- java+web上传文件夹内的所有文件
javaweb上传文件 上传文件的jsp中的部分 上传文件同样可以使用form表单向后端发请求,也可以使用 ajax向后端发请求 1.通过form表单向后端发送请求 <form id=" ...
- Linux上MongoDB一些设置
MongoDB启动停止方法 官网安装介绍中依然有启动停止的方式 1 启动 sudo service mongod start 2 停止 sudo service mongod stop 3 重启 su ...
- 【JVM学习笔记】ServiceLoader类
ServiceLoader.load方法的函数原型如下 public static <S> ServiceLoader<S> load(Class<S> servi ...
- ELK故障处理,不知道成功否
上周?还是上上周??发现ELK的数据都没有更新了,考虑到这个系统目前不重要,就没有理会.今日再次登陆,发现没有数据更新了!!! system overview 没有主机,没有数据. 登陆系统检查状态, ...
- 连载二:RobotFramework+Svn+Jenkins集成测试
使用SVN和Jenkins完成脚本的持续集成测试 目标: 1)使用svn管理脚本: 2)使用jenkins执行脚本: 3)在jenkins中配置svn自动获取最新的脚本执行: 步骤: (1)安装Jen ...
- 【AMAD】django-countries -- 为Django app的form提供country选项,为model提供CountryField
动机 简介 个人评分 动机 有时候看一些数据库设计,国家数据会存在一个单独的表里面.这种方式读取数据库无疑又要加上一层join,很不划算. 简介 [django-countries]1解决的是: 不用 ...