vue+element el-table有关Checkbox的一些功能
在做项目的时候会碰到一些表格操作的问题其中我归整了一下有关于多选功能的一些记录
一:默认选中其中一行
<el-table
class="editTable"
:data="list && list.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
border
ref="multipleTable"
@selection-change="selectionChange"
v-loading="loading">
</el-table>
this.$refs.multipleTable.toggleRowSelection(this.$refs.multipleTable.data[0],true);
二:触发清空所有选中状态
this.$refs.multipleTable.clearSelection();
三:分页选中记录所有选中状态携带记忆功能(表格数据过多需要分页)
:row-key="(row) => row.id" 和 多选 column 添加记忆功能 :reserve-selection="true"
<el-table
class="editTable"
:data="list && list.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
border
ref="multipleTable"
:row-key="(row) => row.id"
@selection-change="selectionChange"
v-loading="loading"> <el-table-column
:type="type"
:reserve-selection="true">
</el-table-column> </el-table>
-----有新的随时更新 2021/7/9
vue+element el-table有关Checkbox的一些功能的更多相关文章
- Vue+element ui table 导出到excel
需求: Vue+element UI table下的根据搜索条件导出当前所有数据 参考: https://blog.csdn.net/u010427666/article/details/792081 ...
- 封装Vue Element的table表格组件
上周分享了几篇关于React组件封装方面的博文,这周就来分享几篇关于Vue组件封装方面的博文,也好让大家能更好地了解React和Vue在组件封装方面的区别. 在封装Vue组件时,我依旧会交叉使用函数式 ...
- vue+element ui table组件封装,使用render渲染
后台管理经常会用到表格,一开始封装了一个常用的功能性表格,点击这里: 后来由于需求增加,在表格中还会用到switch,select,input等多种组件,每次都要在html中增加<el-tabl ...
- vue + element ui table表格二次封装 常用功能
因为在做后台管理项目的时候用到了大量的表格, 且功能大多相同,因此封装了一些常用的功能, 方便多次复用. 组件封装代码: <template> <el-table :data=&qu ...
- 封装Vue Element的可编辑table表格组件
前一段时间,有博友在我那篇封装Vue Element的table表格组件的博文下边留言说有没有那种"表格行内编辑"的封装组件,我当时说我没有封装过这样的组件,因为一直以来在实际开发 ...
- 封装Vue Element的form表单组件
前两天封装了一个基于vue和Element的table表格组件,阅读的人还是很多的,看来大家都是很认同组件化.高复用这种开发模式的,毕竟开发效率高,代码优雅,逼格高嘛.虽然这两天我的心情很糟糕,就像& ...
- vue+element实现分页--之--前端分页
效果图: 访问的数据量小,一次返回所有数据,再次利用elementUI-Table 和el-pagination组件进行展示,关键点事数据的筛选 官网的完整案例 <div class=" ...
- Vue. 之 Element获取table中选中的行
Vue. 之 Element获取table中选中的行 问题描述: 如下截图,在Table中选择数据后,然后在点击“统计”按钮,获取Table表中选择的行 解决方案: 1. 给“统计”这个按钮添加一个点 ...
- VUE -- 对 Element UI table中数据进行二次处理
时间——日期 后台经常给我们返回的是 时间戳 (例如:1535620671) 这时候我们页面展现的时候需要将时间戳转换为我们要的格式 例如 (YYYY-MM-DD HH:mm:ss) 如果是在Elem ...
- vue + element ui 实现实现动态渲染表格
前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...
随机推荐
- 黑马程序员Javaweb综合案例错误总结整理
案例整理(呕心沥血的教训) 其他的我大部分还是不知道那里出了问了,我这个新建的项目must3终于成功了 那个品牌名称和企业名称没有,是要在BrandMapper里加注解@ResultMap 一直报那个 ...
- fastjson场景
json转java对象 // 将Json字符串通过fastjson转为JSONObject对象 JSONObject jsonObject = JSONObject.parseObject(userJ ...
- M1 安装apache tomcat
一.下载以及安装 1.Tomcat(官网:http://tomcat.apache.org/) 2.找到需要的版本:我用的9版本 二.将下载的文件放在自己一个目录下去 三.设置Apache环境路径 e ...
- 设置NTP校时
设置NTP校时-作为客户端 @echo off rem 以管理员身份执行文件 rem 适用于域控PDC主机,对于未加域的计算机可直接使用Internet时间同步 rem 获取管理员权限 %1 msht ...
- 【记录】Linux Mint Cinnamon Desktop Enviroment使用记录
之前使用的系统是Kali Linux,并不是看上了一堆工具,工具的话上虚拟机不好吗,会折腾的docker更好阿,主要是 1. 用习惯了gnome的桌面环境 2. 开箱即用 很多配置他都已经做好了 我都 ...
- js 自定義event
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Django的urls的配置
在一个请求到达的时候,最先达到的就是视图层,然后根据url映射到视图函数.这一部分我们来说明url的配置. 概述 为了给一个应用设计URL,你需要创建一个Python 模块,通常称为URLconf(U ...
- Unity Profiler真机调试
1.在BuildSetting面板中勾选DevelopmentBuild 2. .cmd命令: adb forward tcp:34999 localabstract:com.CompanyName. ...
- Python学习:画K帮
import datetime import pandas_datareader.data as web df_stockload = web.DataReader("600797.SS&q ...
- OpenLayer——模拟运动轨迹
模拟在人地图上移动,动态绘制行动轨迹的功能,附带一个跟随的气泡弹窗. <!DOCTYPE html> <html lang="en"> <head&g ...