el-tree动态添加子节点的问题

如果我们需要动态往el-tree里面某一个节点添加子节点,追加或删除,我跟你讲,一定要显式地调用el-tree的方法,不然的话,后面调用setChecked这种方法看不到效果的。

比如el-tree绑定的data如下:
[{id:"1“,label:"父1”,children:[]}]

el-tree指定node-key=‘id’, 然后在一个mounted之后的事件(比如某个按钮的点击事件)中往data的第一个元素的children里面添加一个node,新data如下:
[{id:"1“,label:"父1”,children:[id:“1-2”,label:“子”,children:[]]}]

这时候,如果你没有显示地调用el-tree的append方法的话,页面当中的el-tree仍然会正常地显示新加元素,于是我还以为好了呢。

但是我要是想添加新元素的同时给他设置checked状态,调用el-tree的setChecked方法,会发现新加元素的checked的设置死活不起效果。

通过调试源码,才发现,必须得显示调用append方法:
在这里插入图片描述
吐血啊,一定要记住啊,el-tree坑真多,关键是悄咪咪的坑, 不注意不知道。还以为好的呢。

在此记录,方便日后查阅。

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

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

相关文章

Elasticsearch:如何选择向量数据库?

作者:来自 Elastic Elastic Platform Team 向量数据库领域是一个快速发展的领域,它正在改变我们管理和搜索数据的方式。与传统数据库不同,向量数据库以向量的形式存储和管理数据。这种独特的方法可以实现更精确、更相关的搜索,并允…

逆向案例二十五——webpack所需模块函数很多,某翼云登录参数逆向。

解决步骤: 网址:aHR0cHM6Ly9tLmN0eXVuLmNuL3dhcC9tYWluL2F1dGgvbG9naW4 不说废话,密码有加密,直接搜索找到疑似加密位置打上断点。 再控制台打印,分析加密函数 有三个处理过程,b[g]得到的是用户名,b[f] 对…

React@16.x(62)Redux@4.x(11)- 中间件2 - redux-thunk

目录 1,介绍举例 2,原理和实现实现 3,注意点 1,介绍 一般情况下,action 是一个平面对象,并会通过纯函数来创建。 export const createAddUserAction (user) > ({type: ADD_USER,payload: user, });这…

如何在Mac下修改VSCode侧边栏字体大小

在日常使用VSCode(Visual Studio Code)进行开发时,我们有时需要对IDE(集成开发环境)的界面进行一些个性化的调整,以提升我们的开发体验。 比如,有些用户可能会觉得VSCode的侧边栏字体大小不符…

uni-app开发日志:unicloud使用时遇到的问题解决汇总(不断补充)

插件安装后提示与原数据库表冲突(2024.7.18) 安装uni-admin后再安装uni-cms,在uni-admin中添加好菜单,结果提示该错误 回到hbuilder中uniCloud/database中找到冲突的部分 比较一下,选中老的删除 opendb-news-articl…

PCB(印制电路板)制造涉及的常规设备

印制电路板(PCB)的制造涉及多种设备和工艺。从设计、制作原型到批量生产,每个阶段都需要不同的专业设备。以下是一些在PCB制造过程中常见的设备: 1. 计算机辅助设计(CAD)软件: - 用于设计PC…

Linux——Shell脚本和Nginx反向代理服务器

1. Linux中的shell脚本【了解】 1.1 什么是shell Shell是一个用C语言编写的程序,它是用户使用Linux的桥梁 Shell 既是一种命令语言,有是一种程序设计语言 Shell是指一种应用程序,这个应用程序提供了一个界面,用户通过这个界面访问…

WPF/C#:实现导航功能

前言 在WPF中使用导航功能可以使用Frame控件,这是比较基础的一种方法。前几天分享了wpfui中NavigationView的基本用法,但是如果真正在项目中使用起来,基础的用法是无法满足的。今天通过wpfui中的mvvm例子来说明在wpfui中如何通过依赖注入与M…

Axure中继器进阶指南:打造专业级交互

中继器进阶篇 前言 经过了基础篇的学习,我们已经掌握了中继器的基本操作,接下来来解锁中继器的进阶操作。 1. 修改删除指定行 首先拖入中继器,加上【修改】 【删除】的按钮,然后给修改按钮添加单击事件选择【更新行】。 这里可以看到我们在中继器内部添加的事件,在编…

Linux编辑器——vim的使用

目录 vim的基本概念 命令模式 底行模式 插入模式 注释和取消注释 普通用户进行sudo提权 vim配置问题 vim的基本概念 一般使用的vim有三种模式: 命令模式 底行模式和插入模式,可以进行转换; vim filename 打开vim,进入的…

ElmoCha——体验最好的 web 内容 AI 总结插件

介绍 最近我用了很多网页总结产品,share 一下我认为最好用的 web 总结的 AI 插件。 当前体验最好的 web 内容总结插件:ElmoChat,由 Lepton 开发,可以生成网页总结、摘要、观点、相关问题。 非常方便的是,总结的内容提…

HarmonyOS根据官网写案列~ArkTs从简单地页面开始

Entry Component struct Index {State message: string 快速入门;build() {Column() {Text(this.message).fontSize(24).fontWeight(700).width(100%).textAlign(TextAlign.Start).padding({ left: 16 }).fontFamily(HarmonyHeiTi-Bold).lineHeight(33)Scroll() {Column() {Ba…

【C++】map和set的使用

目录 一. 关联式容器 二.键值对 三.树形结构的关联式容器 四.map和set在OJ中的使用 一. 关联式容器 序列式容器:已经接触过STL中的部分容器,比如:vector、list、deque、forward_list(C11)等,因为其底层为线性序列的数据结构,里…

Axure RP移动端医院在线挂号app问诊原型图模板

医疗在线挂号问诊Axure RP原型图医院APP原形模板,是一款原创的医疗类APP,设计尺寸采用iPhone13(375*812px),原型图上加入了仿真手机壳,使得预览效果更加逼真。 本套原型图主要功能有医疗常识科普、医院挂号…

一、单例模式

文章目录 1 基本介绍2 实现方式2.1 饿汉式2.1.1 代码2.1.2 特性 2.2 懒汉式 ( 线程不安全 )2.2.1 代码2.2.2 特性 2.3 懒汉式 ( 线程安全 )2.3.1 代码2.3.2 特性 2.4 双重检查2.4.1 代码2.4.2 特性 2.5 静态内部类2.5.1 代码2.5.2 特性 2.6 枚举2.6.1 代码2.6.2 特性 3 实现的要…

Typora 1.5.8 版本安装下载教程 (轻量级 Markdown 编辑器),图文步骤详解,免费领取

文章目录 软件介绍软件下载安装步骤激活步骤 软件介绍 Typora是一款基于Markdown语法的轻量级文本编辑器,它的主要目标是为用户提供一个简洁、高效的写作环境。以下是Typora的一些主要特点和功能: 实时预览:Typora支持实时预览功能&#xff0…

UI设计中的响应式布局策略:让您的界面在各种设备上都表现出色

UI界面设计它是人与机器之间交互的媒介,也是客户体验的媒介(UX)一个组成部分。操作界面由两个主要部分组成:视觉设计(即传达产品的外观和感觉)和交互设计(即元素功能和逻辑组织)。用…

Python创建Excel表和读取Excel表的基础操作

下载openpyxl第三方库 winr打开命令行输入cmd 这个如果不行可以试试其他方法,在运行Python代码的软件里也有直接下载的地方,可以上网搜索 创建Excel表 示例代码:最后要记得保存,可以加一句提示语句。 import openpyxl lst[100,…

TCP/IP四层模型、OSI七层模型

OSI定义了网络互连的七层框架(物理层、数据链路层、网络层、传输层、会话层、表示层、应用层)TCP/IP 四层模型是目前被广泛采用的一种模型,由以下 4 层组成:应用层、传输层、网络层、网络接口层 FTP(File Transfer Pro…

puzzle(0611)《组合+图论》追捕问题

目录 一,追及问题 1,警察和小偷 2,旋转的4个硬币 3,抓狐狸 二,围堵问题 三,追及围堵 一,追及问题 1,警察和小偷 如下图,警察先走,警察和小偷轮流一人…