当前位置: 首页 > news >正文

el-table 多选默认选中(根据返回的id给数据加默认选中状态)

前言

el-table是我们最常用的展示数据的方式,但是有时候需要用到多选来选择数据,新增数据的时候还好,选中状态都是正常的,但是修改就遇到问题,需要对这个已经选择过的数据加上默认的选中状态,本次就是解决这个问题。通过ref这个来解决。

 setDefaultSelection() {// 用的时候将defaultSelectedIds 替换成你的idconst defaultSelectedIds = [1, 3, 5]; // 示例默认选中的行的 idthis.$nextTick(() => {if (this.$refs.singleTable) {this.$refs.singleTable.clearSelection();this.xiaoquAll.forEach(item => {if (defaultSelectedIds.includes(item.id)) {this.$refs.singleTable.toggleRowSelection(item, true);}});}});},

singleTable:el-table的ref
this.xiaoquAll:这个是我的el-tabl后端返回的总数据。
基本上所有的后端返回的数据都是有一个id的,要是没有用就用index来代替,没有id方便
将这个setDefaultSelection函数 在你成功获取到数据之后调用,
注意点:setDefaultSelection函数的使用时机,一定要是有singleTable这个ref生效之后在调用,要是这个ref没有生效,这个函数就没有意义了。

http://www.lryc.cn/news/476047.html

相关文章:

  • 境外网站翻译之自由职业
  • 批量图片转PDF文件的多种方法详解
  • Web服务器(理论)
  • js:()=>(,);()的作用:明确表达式的边界。
  • RSI 5G通信技术中用于标识小区的特定参数
  • JavaScript中的闭包、递归问题
  • 【青牛科技】GC4938替代A4938/Allegro在水泵、筋膜枪、吸尘器和电动工具中的应用
  • 基于yolov5的输电线,电缆检测系统,支持图像检测,视频检测和实时摄像检测功能(pytorch框架,python源码)
  • uniapp下载文件的方案,包括H5,App方案解决办法
  • c++ 贪心算法
  • 15分钟学 Go 第 35 天:Go的性能调优 (7000字详细教程)
  • 6、显卡品牌分类介绍:技嘉 - 计算机硬件品牌系列文章
  • Redis数据类型——针对实习面试
  • roberta融合模型创新中文新闻文本标题分类
  • 《密码系统设计》实验二 4-6学时
  • Zypher Network:全栈式 Web3 游戏引擎,服务器抽象叙事的引领者
  • 2025生物发酵展(济南)为生物制造产业注入新活力共谱行业新篇章
  • git入门教程14:Git与其他工具的集成
  • 在Zetero中调用腾讯云API的输入密钥的问题
  • 【AD】1-8 AD24软件工程创建
  • RT-Thread学习
  • 20241102在荣品PRO-RK3566开发板使用荣品预编译的buildroot通过iperf2测试AP6256的WIFI网速
  • 网络模型——二层转发原理
  • 【编程技巧】C++如何使用std::map管理std::function函数指针
  • 导航栏小案例
  • MyBatis一文入门精通,面试题(含答案)
  • Ubuntu18.04服务器非root用户在虚拟环境下的python版本设定
  • CodeS:构建用于文本到 SQL 的开源语言模型
  • HTML 基础概念:什么是 HTML ? HTML 的构成 与 HTML 基本文档结构
  • 18 Docker容器集群网络架构:一、etcd 概述