解决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);
    });
})
相关推荐
程序员黑豆31 分钟前
从零开始:创建第一个鸿蒙应用程序
前端·harmonyos
只与明月听1 小时前
LangChain 学习-掌握LangChain Core API
前端·人工智能·后端
Listen·Rain1 小时前
Vue3中customRef详解
前端·javascript·vue.js
濮水大叔1 小时前
Hooks 之后,为什么前端仍需要“包裹”能力?
vue.js·react.js·前端框架
sugar__salt1 小时前
Document 切割:RAG 知识库数据预处理实战
javascript·langchain·embedding·js·rag·cheerio
小粉粉hhh1 小时前
React(三)——Redux
前端·javascript·react.js
山东点狮信息科技有限公司2 小时前
企业级开源OA系统推荐
vue.js·spring boot·性能优化·系统架构·开源
易知微EasyV数据可视化2 小时前
定制化3D组件开发:打造差异化孪生体验
前端·人工智能·经验分享·数字孪生
多加点辣也没关系2 小时前
JavaScript|第24章:事件循环与并发模型
开发语言·javascript·ecmascript
前端炒粉3 小时前
Vue2 SSE 流式对话完整前端代码
前端·sse·流式输出