vue2+element-ui

发现element-ui中更改current-node-key值无效，最后用this.$refs.tree.setCurrentKey方法实现了
思路：

1. el-tree加上highlight-current属性，高亮当前选中节点
2. ref="tree"绑定组件
3. el-tree的点击事件@node-click中判断是有子元素的节点，则找到上次高亮的节点，让它继续选中高亮，思路是通过node-key="id"和this.$refs.tree.setCurrentKey方法

  <el-tree
        :data="treeData"
        :props="defaultProps"
        @node-click="handleNodeClick"
        highlight-current
        ref="tree"
        node-key="id"
      >

 handleNodeClick(data, node) {
      if (data.children?.length) {
        this.$nextTick(() => {
          this.$refs.tree.setCurrentKey(this.currentNodeKey);
        });
        return;
      }
      this.currentNodeKey = data.id;
    },

vue3+element-plus

发现element-plus中更改current-node-key值是有效的，通过这个属性实现
思路：

1. el-tree加上highlight-current属性，高亮当前选中节点
2. el-tree的点击事件@node-click中判断有子元素的节点不能选中高亮，核心代码node.isCurrent = false，让当前节点取消选中
3. 这时需要找到上次高亮的节点，让它继续选中高亮，思路是通过node-key与current-node-key属性还原高亮节点

<template>
  <el-tree 
      :data="data" 
      :props="defaultProps" 
      @node-click="handleNodeClick" 
      highlight-current  
      node-key="id"  
      :current-node-key="currentNodeKey"
      default-expand-all
      :expand-on-click-node="false"/>
</template>

<script lang="ts" setup>
import type Node from 'element-plus/es/components/tree/src/model/node'
import { ref, nextTick } from "vue"
interface Tree {
  label: string
  children?: Tree[]
}

const currentNodeKey = ref("")
const treeId = ref("")
const handleNodeClick = (data: Tree, node: Node) => {
    // 有子元素的节点，不能选中
    if (data.children.length) {
        node.isCurrent = false
        // 值更改，触发watch
        currentNodeKey.value = ""
        // 还原之前的高亮节点
        nextTick(() => {
          currentNodeKey.value = treeId.value
        })
        return
    }
    treeId.value = data.id
    // 点击树节点执行的代码
    ...
}

const data: Tree[] = [
  {
    label: 'Level one 1',
    children: [
      {
        label: 'Level two 1-1',
        children: [
          {
            label: 'Level three 1-1-1',
          },
        ],
      },
    ],
  },
  {
    label: 'Level one 2',
    children: [
      {
        label: 'Level two 2-1',
        children: [
          {
            label: 'Level three 2-1-1',
          },
        ],
      },
      {
        label: 'Level two 2-2',
        children: [
          {
            label: 'Level three 2-2-1',
          },
        ],
      },
    ],
  },
  {
    label: 'Level one 3',
    children: [
      {
        label: 'Level two 3-1',
        children: [
          {
            label: 'Level three 3-1-1',
          },
        ],
      },
      {
        label: 'Level two 3-2',
        children: [
          {
            label: 'Level three 3-2-1',
          },
        ],
      },
    ],
  },
]

const defaultProps = {
  children: 'children',
  label: 'label',
}
</script>