element-ui 点击行如何获取table的行索引
文档中有一个tableRowClassName方法,可以获取到当前行的index,
tableRowClassName ({row, rowIndex}) {
//把每一行的索引放进row
row.index = rowIndex;
}
例子:
表头:
<el-table :data="list" v-loading.body="listLoading" element-loading-text="Loading..." border fit
:row-class-name="tableRowClassName"
@row-click = "onRowClick"
highlight-current-row style="width: 100%">
<el-table-column align="center" prop="passtime" label="Time" width="">
js:
tableRowClassName ({row, rowIndex}) {
//把每一行的索引放进row
row.index = rowIndex;
},
onRowClick (row, event, column) {
//行点击消除new标记
var index = row.index;
var deleteIndex = Array.indexOf(this.showIndexArr, index);
if (deleteIndex != -) {
this.showIndexArr.splice(deleteIndex,);
}
}
以上。
参考:https://segmentfault.com/q/1010000007849369
element-ui 点击行如何获取table的行索引的更多相关文章
- Element ui tree树形控件获取当前节点id和父节点id
低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看 最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...
- element-ui 点击获取table的行索引
<el-table :data="list" v-loading.body="listLoading" element-loading-text=&quo ...
- 获取table的行数
对于可扩展行的表格,有时需要不断的添加新行.注意的是,在IDE中编写table的时候,我们常常忽略tbody标签: <table style="width: 100%;"&g ...
- Element ui 2.8版本中的table树不能默认全展开解决方法
方案一:这个方案有问题 <el-table ref="tableTreeRef" :data="tableDate" ...... </el-tab ...
- jquery获取table的行数、列数
$("#grd").find("tr").length; //行数 $("#grd").find("tr").find( ...
- Element ui tree树形控件获取父节点id
Element-ui官网给的方法 getCheckedKeys() { console.log(this.$refs.tree.getCheckedKeys()); }, 这种只有在所有子级都被选中的 ...
- element ui table(表格)点击一行展开
element ui是一个非常不错的vue的UI框架,element对table进行了封装,简化了vue对表格的渲染. element ui表格中有一个功能是展开行,在2.0版本官网例子中,只可以点击 ...
- Vue. 之 Element获取table中选中的行
Vue. 之 Element获取table中选中的行 问题描述: 如下截图,在Table中选择数据后,然后在点击“统计”按钮,获取Table表中选择的行 解决方案: 1. 给“统计”这个按钮添加一个点 ...
- element UI table 过滤 筛选问题
一.问提描述 使用elementUI table 官方筛选案例,发现筛选不是服务器端筛选,而是浏览器端对每一页进行单独筛选. 如何在服务器端筛选? 二.查询Element UI 官网table组 ...
随机推荐
- 将DataRow赋值给model中同名属性
/// <summary> /// 将DataRow赋值给model中同名属性 /// </summary> /// <typeparam name="T&qu ...
- my sql 下左连接 右链接、内连接等应用,INNER JOIN LEFT JOIN RIGHT JOIN
1.数据准备 建两个表格: create table student (idstu int, namestu ) ); ,"张三")(,"李四"),(,&quo ...
- Linux alias命令详解
alias:内置命令(没有路径),设置命令的别名,保护系统,方便 unalias:别名取消 常用的命令展示 临时设置 alias cp='cp –i' unalias cp 取消系统的别命令 ...
- [2018HN省队集训D8T3] 水果拼盘
[2018HN省队集训D8T3] 水果拼盘 题意 给定 \(n\) 个集合, 每个集合包含 \([1,m]\) 中的一些整数, 在这些集合中随机选取 \(k\) 个集合, 求这 \(k\) 个集合的并 ...
- SDN 第一次上机作业
第一题 拓扑: 测试连通性: 第二题 拓扑: 测试连通性: 第三题 拓扑: 测试连通性:
- Maven实战(十)利用 Nexus 来构建企业级 Maven 仓库
目录 一.简介 Nexus是Maven仓库管理器,用来搭建一个本地仓库服务器,这样做的好处是便于管理,节省网络资源,速度快,还有一个非常有用的功能就是可以通过项目的SNAPSHOT版本管理,来进行模块 ...
- C语言不使用加号实现加法运算的几种方法
今天看到<编码:隐匿在计算机软硬件背后的语言>的第十二章:二进制加法器.讲述了全加器,半加器的原理以及如何实现加法.实现加法时所使用的全加器,半加器中包含的所有逻辑门在C语言中都有相应的运 ...
- virtualbox+vagrant学习-2(command cli)-15-vagrant resume命令
Resume 格式: vagrant resume [vm-name] 这将恢复先前挂起的vagrant托管计算机,可能与suspend命令一起使用. 默认情况下,配置的预配置程序在运行该命令时将不再 ...
- python 模拟126邮箱登陆
#coding=utf-8from selenium import webdriverimport time mydriver=webdriver.Firefox()mydriver.get(&quo ...
- [原创]C/C++语言中,如何在main.c或main.cpp中调用另一个.c文件
C/C++语言中,如何在main.cpp中调用另一个.c文件主要有5种思路: 1.在VS2012 IDE中,将被引用的.c文件后缀名全部修改为.h,然后通过IDE的解决方案资源管理器中鼠标右键单击“头 ...