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

elementui table子级tree懒加载bug

1. 删除子级刷新列表子级依然显示

2.更新状态子级列表未刷新

3.编辑子级后刷新页面显示状态未变更

el-table 树表格load源码

首先,load可以执行,但是只剩一个子节点就有问题,那么就直接可以定位bug在load方法里:

文件路径:element-plus\packages\components\table\src\store\tree.ts

 const loadData = (row: T, key: string, treeNode) => {
    const { load } = instance.props as unknown as TableProps<T>
    if (load && !treeData.value[key].loaded) {
      treeData.value[key].loading = true
      load(row, treeNode, (data) => {
        if (!Array.isArray(data)) {
          throw new TypeError('[ElTable] data must be an array')
        }
        treeData.value[key].loading = false
        treeData.value[key].loaded = true
        treeData.value[key].expanded = true
        // 就是这里,我们的子节点删完了data.length == 0,无法赋值
        if (data.length) {
          lazyTreeNodeMap.value[key] = data
        }
        instance.emit('expand-change', row, true)
      })
    }
  }
 

增加方法手动刷新子级数据

// 刷新时

const refreshChild = (parentId) => {

  if (rowMaps.get(parentId)) {

    const { tree, treeNode, resolve } = rowMaps.get(parentId);

    handleLoadTableChild(tree, treeNode, resolve);

  } else {

    sysTemp.value.getTableData();

  }

};

 

// 先new一个map用于数据保存

const rowMaps = reactive(new Map());

 load加载时存储父级id及数据信息

rowMaps.set(tree.id, { tree, treeNode, resolve });

相关文章:

elementui table子级tree懒加载bug

1. 删除子级刷新列表子级依然显示 2.更新状态子级列表未刷新 3.编辑子级后刷新页面显示状态未变更 el-table 树表格load源码 首先&#xff0c;load可以执行&#xff0c;但是只剩一个子节点就有问题&#xff0c;那么就直接可以定位bug在load方法里&#xff1a; 文件路径&am…...

AI与低代码技术融合:如何加速企业智能化应用开发?

引言 随着全球数字化转型的步伐加快&#xff0c;企业在智能化应用开发方面面临着前所未有的挑战和机遇。传统的软件开发方式往往需要大量的技术人员、时间和资源&#xff0c;而在瞬息万变的市场环境中&#xff0c;这种模式显得效率低下且难以满足企业快速迭代和创新的需求。 与…...

【C#】新建窗体文件,Form、UserControl

从用途、功能性和架构方面进行描述。 1. 继承自 Form 的窗体&#xff08;通常是窗口&#xff09;&#xff1a; 在 C# 中&#xff0c;Form 是用于创建应用程序的主窗口或对话框窗口的类。当您继承自 Form 时&#xff0c;您创建的是一个完整的窗口&#xff0c;可以显示内容、与…...

ansible学习笔记之02command模块与shell模块

目录 1、概述 2、模块介绍 2.1 command模块 2.2 shell模块 2.3 小结 3、实验 3.1 测试ls命令 3.2 测试环境变量 3.3 测试操作符">" 1、概述 本文介绍ansible的command模块与shell模块&#xff0c;并通过实验比对两个模块的异同。 2、模块介绍 2.1…...

在Docker中部署禅道,亲测可用

1、确保centos中已安装docker docker -v 2、启动docker systemctl start docker 3、可设置docker开机启动 systemctl enable docker.service 4、获取最新版禅道开源版镜像 docker pull idoop/zentao 5、运行镜像生成禅道容器【创建 /data/www /data/data 目录】 doc…...

C++(十二)

前言&#xff1a; 本文将进一步讲解C中&#xff0c;条件判断语句以及它是如何运行的以及内部逻辑。 一&#xff0c;if-else,if-else语句。 在if语句中&#xff0c;只能判断两个条件的变量&#xff0c;若想实现判断两个以上条件的变体&#xff0c;就需要使用if-else,if-else语…...

【数学建模】线性规划问题及Matlab求解

问题一 题目&#xff1a; 求解下列线性规划问题 解答&#xff1a; 先将题目中求最大值转化为求最小值&#xff0c;则有 我们就可以得到系数列向量: 我们对问题中所给出的不等式约束进行标准化则得到了 就有不等式约束条件下的变系数矩阵和常系数矩阵分别为&#xff1a; 等式…...

【JavaWeb后端学习笔记】Spring全局异常处理器

在程序运行时&#xff0c;不可避免的会出现异常。在三层开发架构中&#xff0c;当Mapper层出现异常、如果不进行处理会抛给Service层&#xff0c;如果Service层也不处理则会抛给Controller层&#xff0c;通常Controller层有许多接口&#xff0c;如果对每个接口单独处理异常&…...

PT8M2102 触控型 8Bit MCU

1 产品概述 ● PT8M2102 是一款基于 RISC 内核的8位 MTP 单片机&#xff0c;内部集成了电容式触摸感应模块、TIMER&#xff0c;PWM、LVR、LVD、WDT等外设&#xff0c;其主要用作触摸按键开关&#xff0c;广泛适用于触控调光、电子玩具、消费电子、家用电器等领域&#xff0c;具…...

4. React 性能优化技巧:如何让你的应用更快

在构建大型应用时&#xff0c;性能优化是一个非常重要的话题。React 提供了许多优化工具&#xff0c;帮助我们提高应用的渲染速度和响应能力。本文将分享一些常见的 React 性能优化技巧。 4.1. 使用 React.memo 缓存组件 当组件的 props 没有变化时&#xff0c;React 默认不会…...

pytest中使用conftest做测试前置和参数化

pytest中比较高阶的应用是&#xff0c;使用conftest去做测试前置工作、测试收尾工作和参数化。conftest是pytest的一个组件&#xff0c;用于配置测试环境和参数。通过conftest, 可以创建一个可复用的测试配置文件&#xff0c;以便在多个测试模块之间共享配置信息。即&#xff0…...

Spring Boot 中使用 @Transactional 注解配置事务管理

事务管理是应用系统开发中必不可少的一部分。Spring 为事务管理提供了丰富的功能支持。Spring 事务管理分为编程式和声明式的两种方式。编程式事务指的是通过编码方式实现事务&#xff1b;声明式事务基于 AOP,将具体业务逻辑与事务处理解耦。声明式事务管理使业务代码逻辑不受污…...

MATLAB 建筑顶面面积计算(95)

MATLAB 建筑顶面面积计算(95) 一、算法介绍二、算法实现1.代码2.结果一、算法介绍 根据给出的建筑顶面点云,计算建筑面积,具体的方法实现和结果如下: 二、算法实现 1.代码 代码如下(示例): % 从 PLY 文件读取点云数据 filename = D:\shuju\屋顶2.ply; % 替换为你的…...

Linux网络编程之---组播和广播

一.组播 1.概述 单播地址标识单个IP 接口&#xff0c;广播地址标识某个子网的所有IP 接口&#xff0c; 多播地址标识一组IP 接口。单播和广播是寻址方案的两个极端(要么单个要么全部)&#xff0c; 多播则意在两者之间提供一种折中方案。多播数据报只应该由对它感兴趣的接口接收…...

Apache Dolphinscheduler可视化 DAG 工作流任务调度系统

Apache Dolphinscheduler 关于 一个分布式易扩展的可视化 DAG 工作流任务调度系统。致力于解决数据处理流程中错综复杂的依赖关系&#xff0c;使调度系统在数据处理流程中开箱即用。 DolphinScheduler 的主要特性如下&#xff1a; 易于部署&#xff0c;提供四种部署方式&am…...

docker 部署共享文档ZFile

1、拉取ZFile镜像 docker pull crpi-k5k93ldwfc7o75ip.cn-hangzhou.personal.cr.aliyuncs.com/tirling-pdf/zfile:latest 2、创建文件夹和进入文件夹 mkdir zfile && cd zfile 3、创建docker-compose.yml配置文件。 vim docker-compose.yml version: 3.3 service…...

面试题之JVM

一、Java虚拟机基本概念 题目1&#xff1a;Java虚拟机&#xff08;JVM&#xff09;是什么&#xff1f; 选项&#xff1a; A. 一种编程语言 B. 一个可以执行Java字节码的虚拟机进程 C. 一个操作系统 D. 一个数据库 参考答案&#xff1a;B 解析&#xff1a;Java虚拟机是一个可…...

二叉树的深搜(不定期更新。。。。。)

二叉树的深搜 验证二叉搜索树 给你一个二叉树的根节点 root &#xff0c;判断其是否是一个有效的二叉搜索树。 有效 二叉搜索树定义如下&#xff1a; 节点的左 子树 只包含 小于 当前节点的数。 节点的右子树只包含 大于 当前节点的数。 所有左子树和右子树自身必须也是二叉…...

WebLLM Chat:无服务器、私密的AI聊天体验

简介 什么是 Web-LLM ? Web-LLM 是一个高性能的浏览器内语言模型推理引擎&#xff0c;允许用户在没有服务器支持的情况下直接在网页浏览器中进行语言模型推理。它利用 WebGPU 进行硬件加速&#xff0c;从而实现强大的 LLM 操作。Web-LLM 完全兼容 OpenAI API&#xff0c;支持…...

C#中的模拟服务器与客户端建立连接

创建一个控制台项目&#xff0c;命名为Server&#xff0c;模拟服务器端。在同一个解决方案下&#xff0c;添加新项目&#xff0c;命名为Client&#xff0c;模拟客户端。在服务器端与客户端之间建立TCP连接&#xff0c;并在客户端发送消息&#xff0c;在服务器端输出。 Server项…...

内存分配函数malloc kmalloc vmalloc

内存分配函数malloc kmalloc vmalloc malloc实现步骤: 1)请求大小调整:首先,malloc 需要调整用户请求的大小,以适应内部数据结构(例如,可能需要存储额外的元数据)。通常,这包括对齐调整,确保分配的内存地址满足特定硬件要求(如对齐到8字节或16字节边界)。 2)空闲…...

【JavaEE】-- HTTP

1. HTTP是什么&#xff1f; HTTP&#xff08;全称为"超文本传输协议"&#xff09;是一种应用非常广泛的应用层协议&#xff0c;HTTP是基于TCP协议的一种应用层协议。 应用层协议&#xff1a;是计算机网络协议栈中最高层的协议&#xff0c;它定义了运行在不同主机上…...

在rocky linux 9.5上在线安装 docker

前面是指南&#xff0c;后面是日志 sudo dnf config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo sudo dnf install docker-ce docker-ce-cli containerd.io -y docker version sudo systemctl start docker sudo systemctl status docker …...

Mybatis逆向工程,动态创建实体类、条件扩展类、Mapper接口、Mapper.xml映射文件

今天呢&#xff0c;博主的学习进度也是步入了Java Mybatis 框架&#xff0c;目前正在逐步杨帆旗航。 那么接下来就给大家出一期有关 Mybatis 逆向工程的教学&#xff0c;希望能对大家有所帮助&#xff0c;也特别欢迎大家指点不足之处&#xff0c;小生很乐意接受正确的建议&…...

Keil 中设置 STM32 Flash 和 RAM 地址详解

文章目录 Keil 中设置 STM32 Flash 和 RAM 地址详解一、Flash 和 RAM 配置界面(Target 选项卡)1. IROM1(用于配置 Flash)2. IRAM1(用于配置 RAM)二、链接器设置界面(Linker 选项卡)1. 勾选“Use Memory Layout from Target Dialog”2. 查看链接器参数(如果没有勾选上面…...

【配置 YOLOX 用于按目录分类的图片数据集】

现在的图标点选越来越多&#xff0c;如何一步解决&#xff0c;采用 YOLOX 目标检测模式则可以轻松解决 要在 YOLOX 中使用按目录分类的图片数据集&#xff08;每个目录代表一个类别&#xff0c;目录下是该类别的所有图片&#xff09;&#xff0c;你需要进行以下配置步骤&#x…...

【碎碎念】宝可梦 Mesh GO : 基于MESH网络的口袋妖怪 宝可梦GO游戏自组网系统

目录 游戏说明《宝可梦 Mesh GO》 —— 局域宝可梦探索Pokmon GO 类游戏核心理念应用场景Mesh 特性 宝可梦玩法融合设计游戏构想要素1. 地图探索&#xff08;基于物理空间 广播范围&#xff09;2. 野生宝可梦生成与广播3. 对战系统4. 道具与通信5. 延伸玩法 安全性设计 技术选…...

AI病理诊断七剑下天山,医疗未来触手可及

一、病理诊断困局&#xff1a;刀尖上的医学艺术 1.1 金标准背后的隐痛 病理诊断被誉为"诊断的诊断"&#xff0c;医生需通过显微镜观察组织切片&#xff0c;在细胞迷宫中捕捉癌变信号。某省病理质控报告显示&#xff0c;基层医院误诊率达12%-15%&#xff0c;专家会诊…...

android RelativeLayout布局

<?xml version"1.0" encoding"utf-8"?> <RelativeLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"match_parent"android:gravity&…...

Ubuntu系统复制(U盘-电脑硬盘)

所需环境 电脑自带硬盘&#xff1a;1块 (1T) U盘1&#xff1a;Ubuntu系统引导盘&#xff08;用于“U盘2”复制到“电脑自带硬盘”&#xff09; U盘2&#xff1a;Ubuntu系统盘&#xff08;1T&#xff0c;用于被复制&#xff09; &#xff01;&#xff01;&#xff01;建议“电脑…...