element-ui表格带复选框使用方法及默认选中方法
一、实现多选:
步骤1:
在表格中添加一列
步骤2:
在data中定义以及数组用来存储选中的元素。例如:multipleSelection:[]
selection-change方法用户实时监听选中元素
实现效果如下:

二、实现默认选中
在获取表格数据时,添加如下方法,其中me.zclbList为获取到的表格数据列表
// 初始查询
public loadData() {
// 提交获取返回数据
let that: any = this;
AuditApi.getAuditItemList({status: 1}).then( (responseJSON: any) => {
this.auditItemList = responseJSON;
that.$nextTick(()=> {
that.toggleSelection(that.auditItemList);
});
});
}
定义ref="table",用来获取该表格
public toggleSelection(rows: any) {
let that: any = this;
if (rows) {
rows.forEach((item: any) => {
//设置该表格选框选中
that.$refs.table.toggleRowSelection(item);
});
} else {
that.$refs.table.clearSelection();
}
}
即可实现默认选中。

element-ui表格带复选框使用方法及默认选中方法的更多相关文章
- jquery完成带复选框的表格行高亮显示
jquery完成带复选框的表格行高亮显示 通过jquery技术来操作表格是件简单的事,通过jquery的语法,可以很轻松的完成表格的隔行换色,悬浮高亮,在实际的应用中可能会出现表格中带复选框的,删除时 ...
- 雷林鹏分享:jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单
jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树(Tree)插件允许您创建一个复选框树.如果您点击一个节点的复选框,这个点击的节点信息将向上和向下继承.例如:点击 ...
- 关于通过jq /js 实现验证单选框 复选框是否都有被选中
今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...
- jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等
转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...
- 转载:Bootstrap之表格checkbox复选框全选
转:http://blog.csdn.net/shangmingchao[商明超的博客] 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: 版权声明:如需 ...
- Bootstrap之表格checkbox复选框全选
效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: <table class="table table-bordered table-hov ...
- Jquery表格变色 复选框全选,反选
/*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...
- WPF:带复选框CheckBox的树TreeView
最近要用WPF写一个树,同事给了我一个Demo(不知道是从哪里找来的),我基本上就是参照了这个Demo. 先放一下效果图(3棵树): 这个树索要满足的条件是: 父节点.Checked=true时,子节 ...
- Bootstrap之表格checkbox复选框全选 [转]
转自: http://blog.csdn.net/shangmingchao/article/details/49761315 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以 ...
随机推荐
- InsetDrawable
表示把一个Drawable嵌入到另外一个Drawable的内部,并且在内部留一些间距, 类似与Drawable的padding属性,但padding表示的是Drawable的内容与Drawable本身 ...
- 阶段5 3.微服务项目【学成在线】_day02 CMS前端开发_12-webpack研究-webpack安装
npm默认安装配置的路径配置在nodejs的node_modules目录 j加上 -g 就是全局安装 后面只写webpack默认安装的是最新版本 指定版本号 视频中建议指定版本号进行安装
- mfc移动文件夹
SHFILEOPSTRUCT FileOp; ZeroMemory((void*)&FileOp,sizeof(SHFILEOPSTRUCT)); FileOp.fFlags = FOF_NO ...
- Java 检查IPv6地址的合法性
Java 检查IPv6地址的合法性 由于IPv4资源即将耗尽,IPv6将要正式启用,这是大势所趋. 一些现有的服务和应用逐步要对IPv6支持,目前还处在过渡阶段. 提前了解一些IPv6的知识,还是有必 ...
- 推荐一个加载动图的网站loading.io
推荐一个非常好玩的loading gif的资源网站:https://loading.io/ 里面有各种loading的动图.
- Ubuntu 16.04安装MySQL设置远程访问出现问题的完美解决方案(error:10061)
一.安装mysql 安装mysql过程中,需要设置mysql的root账号的密码,不要忽略了. sudo apt-get install mysql-server apt isntall mysql- ...
- matlab boundaries和fchcode函数无法执行的解决办法 未定义与 'double' 类型的输入参数相对应的函数 'boundaries'
在测试代码时发现,自己的matlab无法执行Freeman链码函数: boundaries和fchcode函数都无法正常运行: 需要在自己的工作目录中添加如下函数: boundaries fchc ...
- Git速成学习第三课:创建与合并分支
本来第三课想记录一下远程仓库的创建与克隆0.0但是想了想还是不写了. 这里写一下分支管理中的创建与合并. Git速成学习笔记整理于廖雪峰老师的官网网站:https://www.liaoxuefeng. ...
- 最新 欢聚时代java校招面经 (含整理过的面试题大全)
从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.欢聚时代等10家互联网公司的校招Offer,因为某些自身原因最终选择了欢聚时代.6.7月主要是做系统复习.项目复盘.Leet ...
- jquery设置input不可编辑,背景变灰,鼠标变禁止
先看效果 $("#id").attr("onfocus", "this.blur()"); $("#id").css(& ...