解决Element-ui el-tree数据与显示不对应的问题

如图:

后端返回的权限列表,并没有列表 这一项,但是由于父节点 版本打包为选中状态,导致所有子节点都为选中状态。

实现代码如下:

html 复制代码
<el-tree
    ref="tree"
    :data="records"
    show-checkbox
    node-key="id"
    :default-expanded-keys="expandedKeys"
    :default-checked-keys="checkedKeys"
    :props="defaultProps"
/>
javascript 复制代码
this.$refs.tree.setCheckedKeys(checkedKeys);

问题原因:

使用 setCheckedKeys 会存在这个问题,使用 setChecked 可以解决这个问题。

实现代码如下:

复制代码
this.$nextTick(function(){
    var self = this;
    checkedKeys.forEach((value) => {
        self.$refs.tree.setChecked(value, true, false);
    });
})
相关推荐
程序员鱼皮几秒前
Gemini 3.0 炸裂发布!前端又死了???
前端·ai·程序员·互联网·代码
xiangxiongfly9153 分钟前
CSS svg
前端·css·svg
山依尽13 分钟前
如何将一个 React SPA 项目迁移到 Next.js 服务端渲染
前端·next.js
17 分钟前
使用 svgfmt 优化 SVG 图标
前端·svg·icon
Watermelo61718 分钟前
href 和 src 有什么区别,它们对性能有什么影响?
前端·javascript·vue.js·性能优化·html·html5·用户体验
hqk27 分钟前
鸿蒙零基础语法入门:开启你的开发之旅
android·前端·harmonyos
AAA阿giao29 分钟前
大厂面试之反转字符串:深入解析与实战演练
前端·javascript·数据结构·面试·职场和发展·编程技巧
The_cute_cat33 分钟前
通过内网穿透为课设临时添加域名访问【springboot+Vue】
vue.js·spring boot·后端
专业抄代码选手36 分钟前
告别“屎山”:用 Husky + Prettier + ESLint 打造前端项目的代码基石
前端
想进字节冲啊冲1 小时前
Vibe Coding 实战指南:从“手写代码”到“意图设计”的前端范式转移
前端·ai编程