Vue. 之 Element获取table中选中的行

  

  问题描述:

    如下截图,在Table中选择数据后,然后在点击“统计”按钮,获取Table表中选择的行

  

  解决方案:

  1. 给“统计”这个按钮添加一个点击事件:

    代码: <el-button type="primary" size="small" plain  @click="itsmTableCountSelect"><i class="el-icon-s-data"></i> 统计</el-button> 

    

  2. 在<script></script>中的methods添加方法

    代码:

 itsmTableCountSelect() {
console.log('获取统计');
const _selectData = this.$refs.itsmDataTable.selection
console.log(_selectData);
const _msg = '你选中了 [ ' + _selectData.length + ' ] 条数据.';
this.$notify.info({
title: '消息',
message: _msg
});
},

Vue. 之 Element获取table中选中的行的更多相关文章

  1. VUE -- 对 Element UI table中数据进行二次处理

    时间——日期 后台经常给我们返回的是 时间戳 (例如:1535620671) 这时候我们页面展现的时候需要将时间戳转换为我们要的格式 例如 (YYYY-MM-DD HH:mm:ss) 如果是在Elem ...

  2. 用JavaScript,获取Table中指定的行、列

    前言: 先要谢谢George Wing的慷慨赠书<悟透JavaScript>,让我更加感受到了技术交流的重要性,呵呵~ 进入正题,面试题中有一题:如何通过JavaScript获取Table ...

  3. JavaScript实现获取table中某一列的值

    JavaScript实现获取table中某一列的值 1.实现源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...

  4. js循环获取table中的值

    <script type="text/javascript"> function getTdValue() { var tableId = document.getEl ...

  5. JavaScript获取table中某一列的值的方法

    1.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  6. C#+ArcGIS Engine 获取地图中选中的要素

    转自 C#+ArcGIS Engine 获取地图中选中的要素 C#+ArcGIS Engine 获取地图中选中的要素 提供一种简单遍历获取地图中选中要素的方法,代码如下: List<IFeatu ...

  7. 【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数

    一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...

  8. 如何获取jqGrid中选择的行的数据

    原文地址:http://hi.baidu.com/feifan3211/item/c5831f44158761a5df2a9fc1 如何获取jqGrid中选择的行的数据? 下面可以获取选择一行的id, ...

  9. 获取jqGrid中选择的行的数据以及 jqGrid获得所有行数据的方法

    获取jqGrid中选择的行的数据: 获取选择一行的id,如果你选择多行,那下面的id是最后选择的行的id:   1 var id=$('#gridTable').jqGrid('getGridPara ...

随机推荐

  1. Flink 1.9 实战:使用 SQL 读取 Kafka 并写入 MySQL

    上周六在深圳分享了<Flink SQL 1.9.0 技术内幕和最佳实践>,会后许多小伙伴对最后演示环节的 Demo 代码非常感兴趣,迫不及待地想尝试下,所以写了这篇文章分享下这份代码.希望 ...

  2. html常用标签7-多媒体标签

    1.html4中的标签:embed 定义嵌入的内容,可以插入多种形式的多媒体(有建瓯让问题,会用即可) <embed src="路径" type="类型" ...

  3. Asp.Net 应用程序在IIS发布后无法连接oracle数据库问题的解决方法

    asp.net程序编写完成后,发布到IIS,经常出现的一个问题是连接不上Oracle数据库,具体表现为Oracle的本地NET服务配置成功:用 pl/sql 等工具也可以连接上数据库,但是通过浏览器中 ...

  4. springboot核心技术(三)-----web开发

    web开发 1.简介 使用SpringBoot: 1).创建SpringBoot应用,选中我们需要的模块: 2).SpringBoot已经默认将这些场景配置好了,只需要在配置文件中指定少量配置就可以运 ...

  5. PAT甲级——A1030 Travel Plan

    A traveler's map gives the distances between cities along the highways, together with the cost of ea ...

  6. 【DM642学习笔记三】flash的烧写

    ICETEK-DM642-PCI板上的29L008B芯片提供了8M位的Flash空间(访问地址空间是CE1,90000000h~90080000h).主要用于自启动功能和存储FPGA的配置数据. 一. ...

  7. 作业test

    views Car <template> <div class="car"> <Nav/> <div class="wrap&q ...

  8. springboot 集成eureka 超详细配置

    撸了今年阿里.头条和美团的面试,我有一个重要发现.......>>> 原文链接: https://blog.csdn.net/nanbiebao6522/article/detail ...

  9. lumen使用CORS解决跨域问题

    因为公司的业务是前后端分离,web前端和后端接口域名不同,所以存在跨域问题,开始使用的是jsonp解决,但是因为接口风格是rest的,还有delete.put等请求,jsonp就不够用了(涉及HTTP ...

  10. 只要三步!阿里云DLA帮你处理海量JSON数据

    概述 您可能有大量应用程序产生的JSON数据,您可能需要对这些JSON数据进行整理,去除不想要的字段,或者只保留想要的字段,或者仅仅是进行数据查询. 那么,利用阿里云Data Lake Analyti ...