今天使用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如何给指定的单元格添加点击事件?的更多相关文章

  1. 点击表格的单元格时实现变颜色,通过for循环为每个单元格添加一个onclick事件

    <title>无标题文档</title> <script type="text/javascript" language="javascri ...

  2. 27.openpyxl 向指定单元格添加图片并修改图片大小 以及修改单元格行高列宽

    openpyxl 向指定单元格添加图片并修改图片大小 以及修改单元格行高列宽 from openpyxl import Workbook,load_workbook from openpyxl.dra ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格:为所有表格的单元格添加边框

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 在Excel里用vba给合并的单元格添加注释

    Excel里使用VBA对已经合并的单元格添加注释,直接使用AddComment会报: 运行时错误 '1004':应用程序定义或者对象定义错误 找了很多文章都没找到怎么解决,最后发现在AddCommen ...

  5. POI单元格添加公式以及读取公式结果的值

    POI提供了为单元格添加条件样式的方法,但是我并没有找到获取单元格改变后样式的方法,获取到样式依旧是没有改变之前的. 比如为单元格添加条件样式用于监听单元格值是否被修改,如果单元格值被修改那么字体颜色 ...

  6. C# DataGridView中指定的单元格不能编辑

    注意:DataGridView控件是从.NET Framework 2.0版本开始追加的. ReadOnly属性的使用 DataGridView内所有的单元格不能编辑 当DataGridView.Re ...

  7. 使用POI设置导出的EXCEL锁定指定的单元格

    注:要锁定单元格需先为此表单设置保护密码,设置之后此表单默认为所有单元格锁定,可使用setLocked(false)为指定单元格设置不锁定. sheet.protectSheet("&quo ...

  8. 在excel 中某一单元格添加指定字符的示例

    ="select TestSurveyID,'http://www.findoout.cn/survey/viewsurvey.aspx?tid='+CONVERT(varchar(10), ...

  9. element-ui 格式化树形数组在table组件中展示(单元格合并)

    最近做的项目涉及到很多单元格合并问题,element-ui组件对于单元格合并的处理虽然很灵活,但是需要事先计算好每个单元格合并的rowspan和colspan,直接在span-method属性中计算实 ...

随机推荐

  1. C++ STL——C++容器的共性和相关概念

    目录 一 STL容器共性机制 二 STL容器的使用场合 三 函数对象 四 谓词 五 内建函数对象 六 函数对象适配器 注:原创不易,转载请务必注明原作者和出处,感谢支持! 注:内容来自某培训课程,不一 ...

  2. 从数组中找出所有组合为s的数

    java版本 package numCombine; /** * 从数组中找出所有组合为s的数 * @author root * */ public class NumComberAll { publ ...

  3. 前端js数据加密解密

    一.最简单的加密解密   函数escape()和unescape(); 二.base64加密 (1)introduction base64是网络上最常见的用于传输8bit字节码的编码方式之一,base ...

  4. 小D课堂 - 新版本微服务springcloud+Docker教程_5-07 断路器dashboard监控仪表

    笔记 7.断路器Dashboard监控仪表盘实战     简介:讲解断路器Dashboard基础使用和查看     1.加入依赖          <dependency>         ...

  5. linux备忘和卸载

    linux上网 -------------------------------------------------linux卸载------------------------------------ ...

  6. idea设置背景色和字体大小

    修改背景色  点击[File],选择[Settings]. 点击[Editor],选择[color Scheme]. 默认Scheme只有两种.Default是白色,Darcula是黑色   修改字体 ...

  7. Vue 使用eventBus 实现兄弟组件间的通信

    实现方式:  主要是在相互通信的兄弟组件之中,都引入一个新的vue实例,然后通过分别调用这个实例的事件触发事件广播 和监听来实现通信和参数传递. 需求: a页面tree的增删改后,数据还是之前的老数据 ...

  8. lamp的动静分离部署

    一.lamp分离部署工作图 二.LAMP的安装与配置 1.环境准备 2.对 PHP 服务器进行部署 #以下为安装PHP及其依赖 [root@php ~ ]# .tar.gz -C /usr/src [ ...

  9. java发送邮件(一)--补充添加附件

    今天来记录一下如何使用java来发送邮件 背景 之前项目有个需求,当产品出现故障时会把情况上送给服务器,服务器发送邮件将故障产品的位置以及故障信息等告知维修人员.发送邮件的接口不是我负责的,但是有兴趣 ...

  10. City Road

    题目描述 从前有一个叫做”H湖”的地方,”H湖”的居民生活在不同的小岛上,当他们想去其他的小岛时都要通过划小船或者小岛之间的桥来实现.现在政府想实现”H湖”的全畅通!(不一定有直接的桥相连,只要互相间 ...