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坑真多,关键是悄咪咪的坑, 不注意不知道。还以为好的呢。

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

相关推荐
yuezhilangniao5 小时前
AI智能体全栈开发工程化规范 备忘 ~ fastAPI+Next.js
javascript·人工智能·fastapi
~牧马~5 小时前
【记录63】electron打包vue项目之踩坑
vue.js·electron·electron与node兼容
铅笔侠_小龙虾6 小时前
Flutter Demo
开发语言·javascript·flutter
2501_944525546 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 账户详情页面
android·java·开发语言·前端·javascript·flutter
计算机学姐6 小时前
基于SpringBoot的电影点评交流平台【协同过滤推荐算法+数据可视化统计】
java·vue.js·spring boot·spring·信息可视化·echarts·推荐算法
wangdaoyin20106 小时前
若依vue2前后端分离集成flowable
开发语言·前端·javascript
天天进步20157 小时前
AI Agent 与流式处理:Motia 在生成式 AI 时代的后端范式
javascript
心柠7 小时前
vue3相关知识总结
前端·javascript·vue.js
a1117768 小时前
图书借阅管理系统(FastAPI + Vue)
前端·vue.js·fastapi
常年游走在bug的边缘8 小时前
掌握JavaScript作用域:从函数作用域到块级作用域的演进与实践
开发语言·前端·javascript