el-tree数据更新后保持打开之前的状态
时间: 2023-08-22 18:11:04 浏览: 112
要保持el-tree数据更新后保持打开之前的状态,可以使用default-expanded-keys属性和一个数组来记录展开的节点。在数据刷新之后,el-tree会根据这个数组展开对应的选项。
在代码中,可以定义一个expandedList数组作为el-tree的默认展开选项。在load方法中加载el-tree的数据treeData。在nodeExpand方法中,将展开的节点的code添加到expandedList数组中。在nodeCollapse方法中,从expandedList数组中删除对应的选项。在dropSuccess方法中重新加载数据。
简而言之,利用default-expanded-keys属性和expandedList数组来记录展开情况。在数据刷新之后,el-tree会根据这个数组展开选项。\[1\]
另外,还可以使用defaultExpandIds数组来记录展开的节点。在handleNodeExpand方法中,判断当前节点是否存在于defaultExpandIds数组中,如果不存在则将其添加到数组中。在handleNodeCollapse方法中,删除关闭的节点,并递归删除父节点下的所有子节点。\[3\]
综上所述,可以使用default-expanded-keys属性和一个数组来记录el-tree的展开状态,或者使用defaultExpandIds数组来记录展开的节点。
#### 引用[.reference_title]
- *1* *2* [el-tree刷新数据之后保持之前的打开状态](https://blog.csdn.net/m0_49471668/article/details/121474275)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [element el-tree 刷新后保留展开状态](https://blog.csdn.net/zjx147/article/details/124291157)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
阅读全文
相关推荐
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)