当前位置: 首页 > 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项…...

RestClient

什么是RestClient RestClient 是 Elasticsearch 官方提供的 Java 低级 REST 客户端&#xff0c;它允许HTTP与Elasticsearch 集群通信&#xff0c;而无需处理 JSON 序列化/反序列化等底层细节。它是 Elasticsearch Java API 客户端的基础。 RestClient 主要特点 轻量级&#xff…...

树莓派超全系列教程文档--(61)树莓派摄像头高级使用方法

树莓派摄像头高级使用方法 配置通过调谐文件来调整相机行为 使用多个摄像头安装 libcam 和 rpicam-apps依赖关系开发包 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 配置 大多数用例自动工作&#xff0c;无需更改相机配置。但是&#xff0c;一…...

LeetCode - 394. 字符串解码

题目 394. 字符串解码 - 力扣&#xff08;LeetCode&#xff09; 思路 使用两个栈&#xff1a;一个存储重复次数&#xff0c;一个存储字符串 遍历输入字符串&#xff1a; 数字处理&#xff1a;遇到数字时&#xff0c;累积计算重复次数左括号处理&#xff1a;保存当前状态&a…...

条件运算符

C中的三目运算符&#xff08;也称条件运算符&#xff0c;英文&#xff1a;ternary operator&#xff09;是一种简洁的条件选择语句&#xff0c;语法如下&#xff1a; 条件表达式 ? 表达式1 : 表达式2• 如果“条件表达式”为true&#xff0c;则整个表达式的结果为“表达式1”…...

P3 QT项目----记事本(3.8)

3.8 记事本项目总结 项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...

WEB3全栈开发——面试专业技能点P2智能合约开发(Solidity)

一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解&#xff0c;适合用作学习或写简历项目背景说明。 &#x1f9e0; 一、概念简介&#xff1a;Solidity 合约开发 Solidity 是一种专门为 以太坊&#xff08;Ethereum&#xff09;平台编写智能合约的高级编…...

高防服务器能够抵御哪些网络攻击呢?

高防服务器作为一种有着高度防御能力的服务器&#xff0c;可以帮助网站应对分布式拒绝服务攻击&#xff0c;有效识别和清理一些恶意的网络流量&#xff0c;为用户提供安全且稳定的网络环境&#xff0c;那么&#xff0c;高防服务器一般都可以抵御哪些网络攻击呢&#xff1f;下面…...

有限自动机到正规文法转换器v1.0

1 项目简介 这是一个功能强大的有限自动机&#xff08;Finite Automaton, FA&#xff09;到正规文法&#xff08;Regular Grammar&#xff09;转换器&#xff0c;它配备了一个直观且完整的图形用户界面&#xff0c;使用户能够轻松地进行操作和观察。该程序基于编译原理中的经典…...

JS设计模式(4):观察者模式

JS设计模式(4):观察者模式 一、引入 在开发中&#xff0c;我们经常会遇到这样的场景&#xff1a;一个对象的状态变化需要自动通知其他对象&#xff0c;比如&#xff1a; 电商平台中&#xff0c;商品库存变化时需要通知所有订阅该商品的用户&#xff1b;新闻网站中&#xff0…...

【JVM面试篇】高频八股汇总——类加载和类加载器

目录 1. 讲一下类加载过程&#xff1f; 2. Java创建对象的过程&#xff1f; 3. 对象的生命周期&#xff1f; 4. 类加载器有哪些&#xff1f; 5. 双亲委派模型的作用&#xff08;好处&#xff09;&#xff1f; 6. 讲一下类的加载和双亲委派原则&#xff1f; 7. 双亲委派模…...