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 });

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

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

相关文章

SQL语句错误号:Incorrect integer value: ‘‘ for column ‘poi_id‘ at

SQL语句错误号&#xff1a;Incorrect integer value: for column poi_id at通用解决方案 在MySQL 5.7中&#xff0c;如果你遇到 Incorrect integer value: for column poi_id at row 1 错误&#xff0c;这通常意味着你尝试将一个空字符串插入到需要整数值的字段中。以下是几…

在springBoot项目如何对本地配置文件和云服务配置文件独立配置

springBoot中配置文件本地和云服务配置文件独立配置 1.首先我们创建好一个springBoot项目后&#xff0c;需要再创建两个application.yml配置文件&#xff0c;如图 2.然后在各自的配置文件中配置各自环境的信息&#xff0c;注意的是在创建各自环境的yml文件时&#xff0c;必须…

【分布式事务】二、NET8分布式事务实践: DotNetCore.CAP 框架(本地消息表) 、 消息队列(RabbitMQ)、 多类型数据库(MySql、MongoDB)

介绍 DotNetCore.CAP简称CAP, [CAP]是一个用来解决微服务或者分布式系统中分布式事务问题的一个开源项目解决方案, 同样可以用来作为 EventBus 使用,CAP 拥有自己的特色,它不要求使用者发送消息或者处理消息的时候实现或者继承任何接口,拥有非常高的灵活性。我们一直坚信…

aippt:AI 智能生成 PPT 的开源项目

aippt&#xff1a;AI 智能生成 PPT 的开源项目 在现代办公和学习中&#xff0c;PPT&#xff08;PowerPoint Presentation&#xff09;是一种非常重要的展示工具。然而&#xff0c;制作一份高质量的PPT往往需要花费大量的时间和精力。为了解决这一问题&#xff0c;aippt项目应运…

一文说清flink从编码到部署上线

引言&#xff1a;目前flink的文章比较多&#xff0c;但一般都关注某一特定方面&#xff0c;很少有一个文章&#xff0c;从一个简单的例子入手&#xff0c;说清楚从编码、构建、部署全流程是怎么样的。所以编写本文&#xff0c;自己做个记录备查同时跟大家分享一下。本文以简单的…

在VMWare上安装openEuler 22.03-LTS

文章目录 1. openEluer 22.03-LTS概述2. 安装openEluer 22.03-LTS2.1 安装配置虚拟机2.2 安装openEuler2.3 配置虚拟机静态IP地址 3. 使用yum和dnf3.1 使用dnf安装软件包3.2 使用dnf卸载软件包3.3 使用yum安装软件包3.4 使用yum卸载软件包 4. 利用FinalShell连接Server015. Bas…

短信验证码burp姿势

首先声明&#xff0c;本文仅仅作为学习使用&#xff0c;因个人原因导致的后果&#xff0c;皆有个人承担&#xff0c;本人没有任何责任。 在之前的burp学习中&#xff0c;我们学习了图片验证码的突破&#xff0c;但是现实中还有很多短信验证码&#xff0c;在此我介绍几种短信验…

【软件测试面试题】测试理论/基础面试(持续更新)

Hi&#xff0c;大家好。最近很多朋友都在说今年的互联网行情不好&#xff0c;面试很难&#xff0c;不知道怎么复习&#xff0c;我最近总结了一份在软件测试面试中比较常见的测试理论/基础面试面试题合集&#xff0c;希望对大家有帮助。建议点赞收藏再阅读&#xff0c;防止丢失&…

在 Windows WSL 上部署 Ollama 和大语言模型:从镜像冗余问题看 Docker 最佳实践20241208

&#x1f6e0;️ 在 Windows WSL 上部署 Ollama 和大语言模型&#xff1a;从镜像冗余问题看 Docker 最佳实践 ⭐ 引言 随着大语言模型&#xff08;LLM&#xff09;和人工智能技术的迅猛发展&#xff0c;开发者们越来越多地尝试在本地环境中部署模型进行实验。 但部署过程中常…

ContOS7安装完成后的一系列问题

问题1&#xff1a;constos7,安装完后&#xff0c;无法使用yum,导致无法安装任何东西&#xff0c; 解决&#xff1a;原因是国外的镜像地址有问题&#xff0c;改为国内的地址。 查看yum的状态 yum repolist 2.执行如下命令&#xff0c;更换yum源 bash <(curl -sSL https://…

使用JavaScrip和HTML搭建一个简单的博客网站系统

搭建一个简单的博客网站系统&#xff0c;我们需要创建几个基本的页面和功能&#xff1a;登录、注册、文章发布等。这里我们先实现一个基础版本&#xff0c;包括用户登录、注册以及文章发布的功能。由于这是一个简化版的示例&#xff0c;我们将所有逻辑集成在一个HTML文件中&…

uniapp扭蛋机组件

做了一个uniapp的扭蛋机组件&#xff0c;可以前往下载地址下载 仅测试了vue2、3、h5页面微信小程序&#xff0c;理论支持全平台 使用方法简单&#xff0c;具有待机动效、抽奖中动效、掉落奖品动效&#xff0c;可以替换奖品图片&#xff0c;足以满足大部分抽奖页面需求。 示例图…

C#实现一个HttpClient集成通义千问-开发前准备

集成一个在线大模型&#xff08;如通义千问&#xff09;&#xff0c;来开发一个chat对话类型的ai应用&#xff0c;我需要先了解OpenAI的API文档&#xff0c;请求和返回的参数都是以相关接口文档的标准进行的 相关文档 OpenAI API文档 https://platform.openai.com/docs/api-…

用JavaScript实现一个贪吃蛇游戏

原理如下&#xff0c;贪吃蛇的蛇身就是一个数组&#xff0c;数组中的每个元素都是一个坐标&#xff0c;蛇身每次移动时都会在数组前插入一个新坐标&#xff0c;并在数组尾部删掉一条记录&#xff0c;吃到食物后数组的尾部记录就不删。如果移到屏幕边缘会从屏幕的另一边出现。好…

红日靶场vulnstack 4靶机的测试报告[细节](一)

目录 一、测试环境 1、系统环境 2、注意事项 3、使用工具/软件 二、测试目的 三、操作过程 1、信息搜集 2、漏洞利用Getshell ①Struts 2 s2-045漏洞 手工利用s2-45漏洞 Msf综合利用 ②Tomcat框架(CVE-2017-12615) ③phpMyAdmin(CVE-2018-12613) 构造语句写入冰蝎木…

electron 打包 webview 嵌入需要调用电脑摄像头拍摄失败问题

electron 打包 webview 嵌入需要调用电脑摄像头拍摄失败问题 这篇文章是接我cocos专栏的上一篇文章继续写的&#xff0c;我上一篇文章写的是 cocos 开发触摸屏项目&#xff0c;需要嵌入一个网页用来展示&#xff0c;最后通过 electron 打包成 exe 程序&#xff0c;而且网页里面…

Android 开发者选项-模拟辅助显示设备

目录 概述使用开关的代码实现方式系统部分的处理:参考 概述 在Android开发中&#xff0c;模拟辅助显示设备通常指的是通过Android开发者选项来设置的一种虚拟显示设备&#xff0c;它允许开发者在一个设备上模拟另一个设备的显示特性。这种功能对于测试应用程序在不同屏幕尺寸、…

[COLM 2024] V-STaR: Training Verifiers for Self-Taught Reasoners

本文是对 STaR 的改进方法&#xff0c;COLM 是 Conference On Language Models&#xff0c;大模型领域新出的会议&#xff0c;在国际上很知名&#xff0c;不过目前还没有被列入 ccf list&#xff08;新会议一般不会列入&#xff09;&#xff1b;作者来自高校、微软研究院和 Goo…

Spann3R:基于DUSt3R的密集捕获数据增量式重建方法

来自作者Hengyi Wang在b站3D视觉工坊中对于该论文透彻的讲解&#xff0c;这里是相关重要部分的截屏。这篇博客的用途主要是自己做记录&#xff0c;其次分享给感兴趣的同学&#xff0c;最后谢谢作者大佬的认真讲解。 作者是按照这样的次序来介绍的&#xff1a; 首先从传统的三…

SAP-ABAP开发学习-面向对象OOALV(1)

本文目录 一、概述 面向对象开发特点 二、类与对象 程序中类的创建 Class构成要素 对象 方法 一、概述 随着SAP R/3 4.0版本的开发&#xff0c;ABAP语言开始引入了面向对象的开发概念。这在ABAP语言的发展过程中&#xff0c;面向对象&#xff08;Object-oriented&#…