The change in the default-checked-keys property in el-tree does not take effect

The change in the default-checked-keys property in el-tree does not take effect

Here is a summary of some notes I stepped on when developing MAUI applications.

最后更新 1/18/2023 10:02 PM
水星梦月
预计阅读 3 分钟
分类
.NET
标签
.NET C# MAUI

站长开发Dotnet9网站后台前端的文章编辑分类管理功能时遇到了element-uitree组件使用问题,个人尝试未解决,下面一文是一个前端大佬给出的解决方案,至于问题是什么、怎么解决的,请接着看吧,希望对大家有用。

** Start of the text **


前言:使用element-uitree组件时,天真的以为只要动态修改default-checked-keys这个属性值得变化,默认勾选的值也会随之变化,实际发现并不是这样的。

我们先看看官网上对default-checked-keys的定义:(看完依旧觉得没问题)

于是我就去探寻了一下原因是啥:监听到defaultCheckedKeys的变化后遍历数组,添加选中状态,但是当defaultCheckedKeys数组减少时,前面设置的选中的key不会取消。

原因是:tree.vue中使用watch监听default-checked-keys值得变化,调用了以下方法:

This method is used again in tree-store.js

终于知道原因了,只有监听到default-checked-keys值变化时才会遍历default-checked-keys数组设置给里面的值设置选中状态,但是没有取消选中状态的操作,所以当在default-checked-keys原有的数组里面增加需要选中的数据,新增的节点会被选中,反之则不会!!!

** What should I do??? **

Thought:

  1. Modify dependent code

我在这边博客中已提到:el-tree 处理大量数据

  1. 再仔细看看文档找思路,找到了:就是调用setCheckedKeys方法,将需要选中的key值数组传进去,他会重新设置选中状态:

** Be careful when using this method: **

  1. tree已经存在dom中后调用,如果tree没有加载完成,setCheckedKeys是不存在的,所以我们需要使用this.$nextTick(callback)方法,该方法会在 dom 加载完毕之后,执行回调函数。

  2. After calling this method, if you use lazy loading to load the node, the semi-selection status you manually set will not be there. Remember to reset the semi-selection.

This article comes from reprint.

Author: Mercury Dream Moon

Original title: The change in the default-checked-keys property in el-tree does not take effect

Original link: blog.csdn.net/monparadis/article/details/114087838

Keep Exploring

延伸阅读

更多文章
同分类 / 同标签 9/21/2023

Comparative analysis of cross-platform frameworks based on XAML

Over the years, XAML-based UI frameworks have developed a lot. These frameworks mainly include: Avalonia UI, Uno Platform and. NET MAUI that support cross-platform applications. If Microsoft had launched a cross-platform UI framework like Flutter earlier, we might not have had so many options.

继续阅读
同分类 / 同标签 4/22/2026

Support for. NET by operating system versions (250707 update)

Use virtual machines and test machines to test the support of each version of the operating system for. NET. After installing the operating system, it is passed by measuring the corresponding running time of the installation and being able to run the Stardust Agent.

继续阅读