位置: IT常识 - 正文

elementui中表格多选+分页,保存所有选中数据(elementui的表格)

编辑:rootadmin
element UI中table表格在选中数据后点击分页,再选中数据,回到第一页后,原来选中的数据已经不再是勾选状态了,现在要怎样记住所有分页中的勾选状态呢?我这里有比较简便的方法。不需要缓存数据等复杂的方式。 1、首先在table标签上定义row-key和ref标志名称。具体row-key等功效, ...

推荐整理分享elementui中表格多选+分页,保存所有选中数据(elementui的表格),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:elementui表格多选框,elementui多个dialog,element ui表格多选,elementui复杂表格,element表格表单,element ui表格多选,element ui表格多选,elementui表格多选框,内容如对您有帮助,希望把文章链接给更多的朋友!

element UI中table表格在选中数据后点击分页,再选中数据,回到第一页后,原来选中的数据已经不再是勾选状态了,现在要怎样记住所有分页中的勾选状态呢?我这里有比较简便的方法。不需要缓存数据等复杂的方式。

1、首先在table标签上定义row-key和ref标志名称。具体row-key等功效,可以参考element UI文档。代码如下:

<el-table ref="table" v-loading="loading" :data="dataList" row-key="id" @select="selectItem" @select-all="selectAll" > <el-table-column key="1" type="selection" width="40" reserve-selection /></el-table>elementui中表格多选+分页,保存所有选中数据(elementui的表格)

2、定义选择单列(selectItem)和全选(selectAll)的方法。代码如下:

selectItem(list, row) { this.checkList = list}

把当前页选中的数据保存到checkList数组中,该数据仅保存的是当前页选中数据。(若切换分页选中,数据会被覆盖为最新选中数据)

selectAll(selection) { // 若取消全选,当前页的选中数据移除 if (selection.length === 0) { const ids = this.dataList.map((i) => { return i.id }) for (var i = 0; i < this.checkList.length; i++) { if (ids.indexOf(this.checkList[i].id) > -1) { this.checkList.splice(i, 1) i-- } } } const arr = [...selection, ...this.checkList] this.checkList = Array.from(new Set(arr))},

全选的方法中,需要判断是勾选还是取消勾选。若取消勾选,需要把当前页选中的数据全部清空。

3、清空所有选中的数据方式。代码如下:

this.$refs.table.clearSelection()this.checkList = []

清空表格中选中项,再清空选中数组。

这种处理方式,就可以在分页时依然记得之前选中的数据,返回原来分页数据还在,全选选中与否,数据都可以随之修改。nice~~

本文链接地址:https://www.jiuchutong.com/zhishi/304776.html 转载请保留说明!

上一篇:什么是Python中的闭包(什么叫python)

下一篇:跨域问题及其解决方法(JSONP&CORS)(跨域问题是什么)

  • 电脑怎么设置屏保(电脑怎么设置屏幕亮度)

    电脑怎么设置屏保(电脑怎么设置屏幕亮度)

  • vivo手机微信怎么加锁(vivo手机微信怎么显示在桌面上)

    vivo手机微信怎么加锁(vivo手机微信怎么显示在桌面上)

  • 闲鱼未读信息可以撤回吗(闲鱼未读信息让对方看不到)

    闲鱼未读信息可以撤回吗(闲鱼未读信息让对方看不到)

  • recyclebinhw 是什么文件(recyclebinhw是什么文件夹)

    recyclebinhw 是什么文件(recyclebinhw是什么文件夹)

  • 网易云怎么换不了头像(网易云不能切换下一首)

    网易云怎么换不了头像(网易云不能切换下一首)

  • 拼多多钱付了没人拼单怎么办(拼多多钱付了没人拼单商家怎么办)

    拼多多钱付了没人拼单怎么办(拼多多钱付了没人拼单商家怎么办)

  • 苹果电池充到98充不进电了(苹果电池充到98就充不进去了)

    苹果电池充到98充不进电了(苹果电池充到98就充不进去了)

  • 设备离线2是怎么回事(设备离线20102004)

    设备离线2是怎么回事(设备离线20102004)

  • 录屏怎么截取一部分?(录屏怎么截取一半画面 视频裁剪部分画面的方法)

    录屏怎么截取一部分?(录屏怎么截取一半画面 视频裁剪部分画面的方法)

  • 拼多多小黑屋多久能恢复(拼多多小黑屋多久自动解封)

    拼多多小黑屋多久能恢复(拼多多小黑屋多久自动解封)

  • xr的运行内存多大(xr手机运行内存多大)

    xr的运行内存多大(xr手机运行内存多大)

  • 笔记本触控板不能滑动了(笔记本触控板不能上下滑动)

    笔记本触控板不能滑动了(笔记本触控板不能上下滑动)

  • 电脑最小化看直播算不算时长(电脑怎么打开最小化窗口)

    电脑最小化看直播算不算时长(电脑怎么打开最小化窗口)

  • iwatch怎么开不了机(iwatch为什么无法开机)

    iwatch怎么开不了机(iwatch为什么无法开机)

  • 抖音限流会有通知吗(抖音如果限流会通知吗)

    抖音限流会有通知吗(抖音如果限流会通知吗)

  • 华为mate30pro有没有来电闪光灯(华为mate30pro有没有无线充电功能)

    华为mate30pro有没有来电闪光灯(华为mate30pro有没有无线充电功能)

  • 苹果手机iforgot是什么(苹果手机怎么录屏)

    苹果手机iforgot是什么(苹果手机怎么录屏)

  • 苹果手机怎么设置铃声(苹果手机怎么设置自己喜欢的铃声)

    苹果手机怎么设置铃声(苹果手机怎么设置自己喜欢的铃声)

  • vivo手机otg怎么下歌(vivo手机oTG怎么打开)

    vivo手机otg怎么下歌(vivo手机oTG怎么打开)

  • 天猫会员店红包怎么使用(手机天猫会员店红包是什么意思)

    天猫会员店红包怎么使用(手机天猫会员店红包是什么意思)

  • 说说如何取消私密(怎么取消说说设置为私密)

    说说如何取消私密(怎么取消说说设置为私密)

  • 华为手环丢失后怎样能追踪下落(华为手环丢失后,别人连接手机可以看到我手机内容吗)

    华为手环丢失后怎样能追踪下落(华为手环丢失后,别人连接手机可以看到我手机内容吗)

  • 袖珍相机有哪些特点(袖珍相机有哪些品牌)

    袖珍相机有哪些特点(袖珍相机有哪些品牌)

  • 抖音的水印在哪设置(抖音视频水印在哪)

    抖音的水印在哪设置(抖音视频水印在哪)

  • 12306候补下单怎么操作呢(12306候补下单怎么添加儿童)

    12306候补下单怎么操作呢(12306候补下单怎么添加儿童)

  • 一加7pro屏占比多少(一加7pro屏幕尺寸比例)

    一加7pro屏占比多少(一加7pro屏幕尺寸比例)

  • 异地预缴附加税需要计提吗
  • 收到返款计入什么科目
  • 一般纳税人需要缴纳哪些税种
  • 什么情况下核定征收转为查账征收
  • 税控盘当月不抵扣怎么申报
  • 小规模一季度不超过45万
  • 进项税发票留抵
  • 白条入账所得税怎么做纳税调曾
  • 计入增值税应税销售额
  • 投资公司收回投资款
  • 跨地区预缴税款需缴纳哪些
  • 代扣工资申请怎么写
  • 统借统还如何缴纳增值税
  • 差额纳税怎么记账
  • 预缴企业所得税研发费用加计扣除
  • 车船税为什么没有优惠
  • 免税增值税发票怎么做账
  • 商品进销差价如何结平
  • 成品加工为另一个产品
  • 企业计提的工资如何算
  • 购买员工宿舍床上用品怎么入账
  • w11系统有哪些新功能
  • 企业收到财政资金
  • 事业单位财政拨款是编制吗
  • 电器维修公司买什么保险
  • 鸿蒙系统支持第三方相机吗
  • 电脑系统权限管理在哪里
  • 将现金存入银行,登记银行存款日记账的依据一般是
  • 固定资产的主要特征有哪些
  • 未缴纳社保可以直接走人吗
  • 今天春节是什么生肖
  • 企业清算分配的财产金额怎么算出来
  • 如何用php制作网页
  • php中的正则表达式怎么使用
  • 盘盈的存货计入哪个科目
  • 单据已经生成凭证,不允许自动删除
  • 应收账款的会计要素
  • 产品检测费可以放入研发费用吗
  • 工会经费可以发购物卡吗
  • SQLite学习手册(SQLite在线备份)
  • 保险支票托收
  • 专利年费的滞纳金怎么做账
  • sqlserver2008实例配置
  • 小企业长期债券投资损失应当计入
  • 工会经费和残保金计入什么科目
  • 材料暂估入库的附件需要哪些资料
  • 利润分配科目是所有者权益科目吗
  • 土地作为无形资产入账依据
  • 临时工工资无发票个税怎么申报
  • 固定资产未提完折旧
  • 房地产企业抵押借款
  • 收到国税退税收怎么做账
  • 成品油发票的勾选方法
  • 支付外债利息要代扣代缴哪几个税
  • 本期应征增值税销售额是什么意思
  • 拆除费计入哪个科目
  • 金税三期网络设置
  • ubuntu系统中文
  • mysql5.5忘记密码
  • win10无法新建文件夹怎么办?(已解决)
  • freebsd怎么安装软件
  • windrv.exe
  • linux系统输入法锁定了怎么解开
  • 快捷键f1怎么用不了
  • linux命令行是什么字体
  • centos6.10安装
  • win8.1启动项设置
  • linux如何进行命令操作
  • 基于jQuery中ajax的相关方法汇总(必看篇)
  • js有哪些作用域,分别是什么意思
  • 原生js实现路由
  • JavaScript开发技巧
  • javascript总结笔记
  • 备份系统apk
  • 北京车位过户手续费多少
  • 泉州企业医保哪里缴费
  • 因公出差伙食补助标准
  • 税务局 协查函
  • 动物大联盟是国内品牌吗
  • 营销代码是多少
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设