el-table折叠懒加载支持排序

el-table折叠懒加载支持排序

因为el-table懒加载的子节点是通过缓存实现的,如果想在展开的情况下直接刷新对应子节点数据,要操作el-table组件自身数据,否则不会更新

以排序功能为例

	 maps: new Map() //用于存储子节点懒加载的数据
	// 加载子节点的load方法async load(tree, treeNode, resolve) {// 保存点击节点的信息this.maps.set(tree.precinctId, { tree, treeNode, resolve })let params = {orderBy: this.orderBy}let treeData = []this.tableLoading = truelet { data: res } = await getData(params)this.tableLoading = falseif (res.code === 200) {treeData = res.data} else {treeData = []}setTimeout(() => {resolve(treeData)}, 300)},
  // 点击排序后,先获取父节点数据,然后遍历数据,判断是否存在懒加载节点sortChange(){await this.getTableData(false)  this.tableData.forEach(item => {this.refreshLoadTree(this.$refs.tableRef.store.states, this.maps, item.precinctId)})},// 更新懒加载节点refreshLoadTree(state, maps, id) {let treeId = idif (maps.get(id)) {// 获取节点状态const treeStatus = state.treeData[treeId]const { tree, treeNode, resolve } = maps.get(id)this.$set(state.lazyTreeNodeMap, treeId, []) // 先清空if (tree) {const { expanded, loaded } = treeStatus// 如果未展开但已经缓存if (!expanded) {if (loaded) {// 修改为未加载状态this.$set(this.$refs.tableRef.store.states.treeData[treeId], 'loaded', false)}} else {// 重新执行父节点加载子级操作this.load(tree, treeNode, resolve)}}}},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/74394.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Off-Road-Freespace-Detection配置pytorch2.0.0

一、概述 在github上进行开源代码搜索,发现了Off-Road-Freespace-Detection(链接如下所示)。这是对越野环境可通行区域的检测,在经过测试之后,发现对自己有益。 GitHub - chaytonmin/Off-Road-Freespace-Detection: O…

ChatGPT降低论文AIGC重复率的提示词合集(高效降重方法)

💡 问题:写完毕业论文后,查AIGC率过高,手动降重后仍然很高,该怎么办? 📌 解决方案: 1️⃣ 先查AIGC率(找出AI生成的部分) 2️⃣ 用ChatGPT优化(使…

【Spring 新特性全解析】

Spring 新特性全解析 引言 在当今 Java 企业级开发领域,Spring 框架无疑是中流砥柱般的存在。它以其强大的功能、高度的可扩展性和便捷的开发体验,赢得了广大开发者的青睐。随着技术的不断演进,Spring 也在持续更新迭代,带来了一…

System.arraycopy 在音视频处理中的应用

在音视频开发领域,我们经常需要处理大量的数据,例如音频 PCM 数据的传输、视频帧的缓存等。在这些场景下,数据的复制与传输往往直接影响到应用的性能。Java 提供的 System.arraycopy 方法,在音视频处理代码中出现频率非常高。本文…

fastapi+angular评论和回复

说明:fastapiangular评论和回复 效果图: step1:sql show databases; DROP TABLE users; SHOW CREATE TABLE db_school.users; show tables; use db_school; SELECT * FROM db_school.jewelry_categories; CREATE DATABASE db_school; select *from users -- 用户…

C++11QT复习 (三)

文章目录 [toc]Day5-2 文件IO(2025.03.24)1. 缓冲区与刷新1.1 常见的缓冲刷新方式 2. 文件读写操作2.1 读取文件2.2 写入文件2.3 追加模式写入2.3 完整代码 3. 文件定位操作4. 字符串IO5. 配置文件解析示例6. 完整代码7. 二进制文件操作总结 Day5-2 文件…

Redis Sentinel 详解

Redis Sentinel 详解 1. 什么是 Redis Sentinel?有什么用? Redis Sentinel(哨兵) 是 Redis 官方提供的高可用性解决方案,主要用于监控、通知和自动故障转移。当 Redis 主节点(master)发生故障…

AI日报 - 2025年3月25日

🌟 今日概览(60秒速览) ▎🤖 AGI突破 | Nebula(Google Gemini 2.0 Pro)破解复杂数学谜题 编码与推理能力再上新台阶 ▎💼 商业动向 | Sesame AI开源10亿参数语音模型CSM-1B 语音AI进入普惠时代 …

AI医疗革命:英伟达GTC 2025医疗健康与生命科学会议全分析

AI医疗革命:英伟达GTC 2025医疗健康与生命科学会议全分析 一、GTC 2025:AI 医疗的算力与生态双突破 1.1 黄仁勋演讲核心:从训练到推理的代际跨越 在科技界瞩目的英伟达 GTC 2025 大会上,英伟达 CEO 黄仁勋的主题演讲成为全场焦点,为 AI 医疗领域带来了极具变革性的消息。…

【机器学习/大模型/八股文 面经 (一)】

1. PPO算法中使用GAE的好处以及参数γ和λ的作用是什么? 参考答案: GAE(Generalized Advantage Estimation) 的优势在于通过指数加权多步TD误差,平衡优势估计的偏差与方差,提升策略优化的稳定性。γ(折扣因子):控制未来奖励的衰减程度,值越大表示更关注长期收益。λ…

03 Python 基础:数据类型、运算符与流程控制解析

文章目录 一、数据类型 内置的六大类数字类型整数类型 int浮点数 float布尔 bool字符串 str 变量命名 二、数字类型的相互转换显式类型的转换整数,浮点数,复数 之间的显式转换 隐式类型的转换 三、标识符算术运算符比较运算符逻辑运算符位运算符赋值运算…

视频知识库初步设想

将视频字幕提取出来作为知识库来源定位,下一步设想:把视频上的图片信息也精简出来作为定位。 下面是测试例子: 入参: {"model":"deepseek-ai/DeepSeek-R1-Distill-Llama-8B","messages":[{"role":"system","cont…

数据库原理13

1.关系模式设计不当引起的问题:数据冗余;更新异常;插入异常;删除异常 2.外码可以是单个属性,也可以是属性组 3.动态SQL是SQL标准提供的一种语句运行机制 4.若一个模式分解保持函数依赖,则该分解一定具有…

初级:异常处理面试题深度解析

一、引言 在Java开发中,异常处理是确保程序健壮性和稳定性的重要机制。面试官通过相关问题考察候选人对异常处理的理解和运用能力,以及在实际开发中处理异常的经验。本文将深入剖析常见的异常处理面试题,结合实际开发场景,帮助读…

Apache Spark - 用于大规模数据分析的统一引擎

Apache Spark - 用于大规模数据分析的统一引擎 下载运行示例和 Shell使用 Spark Connect 在 Anywhere 上运行 Spark 客户端应用程序 在集群上启动从这里去哪里使用 Spark Shell 进行交互式分析基本有关数据集作的更多信息缓存 自包含应用程序从这里去哪里 Apache Spark 是用于大…

餐饮管理系统的设计与实现(代码+数据库+LW)

摘 要 互联网发展至今,无论是其理论还是技术都已经成熟,而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播,搭配信息管理工具可以很好地为人们提供服务。针对信息管理混乱,出错率高,信息安全性差&#…

【C#】Winform调用NModbus实现Modbus TCP 主站通讯

一、前言 Modbus是一种串行通信协议,是工业领域全球最流行的协议之一。 1.1 环境 系统:Win11 工具:Visual Studio 2022 .Net 版本:.Net Framework4.6.0 依赖库:NModbus 3.0.81 1.2 协议类型 Modbus RTU:一…

【leetcode题解】贪心算法

目录 贪心算法 柠檬水找零 将数组和减半的最少操作次数 最大数 摆动序列 最长递增子序列 递增的三元子序列 最长连续递增序列 买卖股票的最佳时机 买卖股票的最佳时机 II K 次取反后最大化的数组和 按身高排序 优势洗牌 最长回文串 增减字符串匹配 分发饼干 最…

Langchain4J框架相关面试题

以下是关于Langchain4J框架的面试题目及答案 ### Langchain4J基础概念类 1. **Langchain4J框架是什么?它的核心功能有哪些?** Langchain4J是一个用于构建语言模型应用的Java框架,它为开发者提供了一套简洁高效的API,使得在Jav…

Apache Doris

Apache Doris介绍 Apache Doris 是一个基于 MPP 架构的高性能、实时的分析型数据库,以极速易用的特点被人们所熟知,仅需亚秒级响应时间即可返回海量数据下的查询结果,不仅可以支持高并发的点查询场景,也能支持高吞吐的复杂分析场…