一、实现多选:
步骤1:
在表格中添加一列

步骤2:
在data中定义以及数组用来存储选中的元素。例如:multipleSelection:[]

selection-change方法用户实时监听选中元素


实现效果如下:

二、实现默认选中

在获取表格数据时,添加如下方法,其中me.zclbList为获取到的表格数据列表


// 获取后台数据
    public mounted() {
        this.loadData();
    }

// 初始查询
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表格带复选框使用方法及默认选中方法的更多相关文章

  1. jquery完成带复选框的表格行高亮显示

    jquery完成带复选框的表格行高亮显示 通过jquery技术来操作表格是件简单的事,通过jquery的语法,可以很轻松的完成表格的隔行换色,悬浮高亮,在实际的应用中可能会出现表格中带复选框的,删除时 ...

  2. 雷林鹏分享:jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单

    jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树(Tree)插件允许您创建一个复选框树.如果您点击一个节点的复选框,这个点击的节点信息将向上和向下继承.例如:点击 ...

  3. 关于通过jq /js 实现验证单选框 复选框是否都有被选中

    今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...

  4. jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等

    转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...

  5. 转载:Bootstrap之表格checkbox复选框全选

    转:http://blog.csdn.net/shangmingchao[商明超的博客] 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: 版权声明:如需 ...

  6. Bootstrap之表格checkbox复选框全选

    效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: <table class="table table-bordered table-hov ...

  7. Jquery表格变色 复选框全选,反选

    /*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...

  8. WPF:带复选框CheckBox的树TreeView

    最近要用WPF写一个树,同事给了我一个Demo(不知道是从哪里找来的),我基本上就是参照了这个Demo. 先放一下效果图(3棵树): 这个树索要满足的条件是: 父节点.Checked=true时,子节 ...

  9. Bootstrap之表格checkbox复选框全选 [转]

    转自: http://blog.csdn.net/shangmingchao/article/details/49761315 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以 ...

随机推荐

  1. 详解python中@的用法

    python中@的用法 @是一个装饰器,针对函数,起调用传参的作用. 有修饰和被修饰的区别,‘@function'作为一个装饰器,用来修饰紧跟着的函数(可以是另一个装饰器,也可以是函数定义). 代码1 ...

  2. 在IIS7、IIS7.5中应用程序池最优配置方案

    先介绍几个简单的设置 应用程序池 > 高级设置 1.基本设置 队列长度: 65535 启动32位应用程序 否则安装一些32的组建或32位的php都会出错 托管管道模式 Classsic 2.高级 ...

  3. 阶段5 3.微服务项目【学成在线】_day04 页面静态化_01-页面静态化需求分析

    上半部分就是静态化 业务流程如下: 1.获取模型数据 2.制作模板 3.对页面进行静态化 4.将静态化生成的html页面存放文件系统中 5.将存放在文件系统的html文件发布到服务器

  4. String字符串的截取

    根据某个字段将字符串分割成绩部分 String str = "string number one 1/9/0"; //将字符串由/ 截取成绩部分 String[] strs = s ...

  5. Scrapy框架(1)

    参考博客: 10.scrapy框架简介和基础应用 Scrapy框架(1)

  6. [译]如何使用Python构建指数平滑模型:Simple Exponential Smoothing, Holt, and Holt-Winters

    原文连接:How to Build Exponential Smoothing Models Using Python: Simple Exponential Smoothing, Holt, and ...

  7. Leetcode之动态规划(DP)专题-474. 一和零(Ones and Zeroes)

    Leetcode之动态规划(DP)专题-474. 一和零(Ones and Zeroes) 在计算机界中,我们总是追求用有限的资源获取最大的收益. 现在,假设你分别支配着 m 个 0 和 n 个 1. ...

  8. 2019SDN第四次作业

    一.配置java环境 输入命令sudo gedit ~/.bashrc 添加如下内容 二.启动并安装插件 cd distribution-karaf-0.4.4-Beryllium-SR4/bin/ ...

  9. python解析jSON文件

    一.jSON文件 http://baike.baidu.com/link?url=wYeeLnhpXX-Tt8AoBRSNPh2P7Z2YHyK2tdD1tbBOQMfJIpA-YNHMOg2ZN6a ...

  10. nginx http跳https配置

    为了数据传输的安全性以及防止网页被恶意篡改,现在大多数网站都配置了https. 如何保证用户都是通过https进行访问呢? 如果有用到nginx,我们可以配置强制跳转. 在nginx配置中添加: se ...