vue element tree 回显展开选中的节点代码怎么写

在 Vue Element Tree 中，可以通过设置节点的 `default-expanded` 属性来设置默认展开节点。当需要回显展开选中的节点时，可以通过以下步骤实现：

1. 记录选中节点的路径或 ID
2. 在 Tree 组件的 `data` 中遍历所有节点，找到需要展开的节点
3. 设置需要展开节点的 `default-expanded` 属性为 `true`

以下是一个示例代码：

<template>
  <el-tree :data="treeData"></el-tree>
</template>

<script>
export default {
  data() {
    return {
      treeData: [
        {
          id: 1,
          label: 'Node 1',
          children: [
            {
              id: 2,
              label: 'Node 1-1',
            },
            {
              id: 3,
              label: 'Node 1-2',
            },
          ],
        },
        {
          id: 4,
          label: 'Node 2',
          children: [
            {
              id: 5,
              label: 'Node 2-1',
            },
            {
              id: 6,
              label: 'Node 2-2',
            },
          ],
        },
      ],
      selectedNodeId: 3, // 选中节点的 ID
    };
  },
  mounted() {
    this.expandSelectedNode();
  },
  methods: {
    expandSelectedNode() {
      const selectedNode = this.findNodeById(this.treeData, this.selectedNodeId);
      if (selectedNode) {
        this.expandNode(selectedNode);
      }
    },
    findNodeById(nodes, id) {
      for (const node of nodes) {
        if (node.id === id) {
          return node;
        }
        const childNode = this.findNodeById(node.children, id);
        if (childNode) {
          return childNode;
        }
      }
      return null;
    },
    expandNode(node) {
      node['default-expanded'] = true;
      if (node.parent) {
        this.expandNode(node.parent);
      }
    },
  },
};
</script>

在这个示例中，我们在 `selectedNodeId` 中记录了选中的节点的 ID。在 `mounted` 钩子中调用了 `expandSelectedNode` 方法，该方法会根据选中节点的 ID 查找到该节点，并调用 `expandNode` 方法展开该节点。`expandNode` 方法会递归向上展开该节点的所有父节点，并设置它们的 `default-expanded` 属性为 `true`。这样，当 Tree 组件渲染时，选中的节点就会被展开了。