el-tree更新数据不折叠
时间: 2023-09-04 14:14:36 浏览: 65
如果你想在更新 el-tree 的数据时保持节点展开状态,可以在更新前获取当前节点的展开状态,然后在更新后重新设置展开状态。
以下是一个示例代码:
```javascript
// 找到需要更新的节点
function findNode(treeData, key) {
let node = null;
for (let i = 0; i < treeData.length; i++) {
const item = treeData[i];
if (item.key === key) {
node = item;
break;
}
if (item.children) {
node = findNode(item.children, key);
if (node) {
break;
}
}
}
return node;
}
// 获取节点的展开状态
function getNodeExpanded(treeData, key) {
const node = findNode(treeData, key);
if (node) {
return node.expanded;
}
return false;
}
// 修改节点的 data 属性
function updateNodeData(treeData, key, newData) {
const node = findNode(treeData, key);
if (node) {
node.data = newData;
}
}
// 刷新树
function refreshTree(treeData, key, expanded) {
const elTree = this.$refs.tree; // 替换为你的 el-tree 引用
const node = findNode(treeData, key);
if (node) {
const parentNode = elTree.getNode(node);
elTree.updateKeyChildren(parentNode.key, treeData);
if (expanded) {
elTree.setExpandedKeys([parentNode.key]);
}
}
}
// 使用示例
const treeData = [
{
label: 'Node 1',
key: '1',
data: { name: 'Node 1', value: 1 },
children: [
{
label: 'Node 1.1',
key: '1-1',
data: { name: 'Node 1.1', value: 2 },
},
],
},
];
const newData = { name: 'Updated Node 1', v
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.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)