解决Ant Design升级后<a-tree>不可用的问题

Ant Design从"ant-design-vue": "^2.2.8"升级到"ant-design-vue": "^4.2.6"后，原来的<a-tree>代码无法选择叶子结点了，想同时兼容旧的。

解决方式：

1.安装旧版本antd

npm install ant-design-vue-v2@npm:ant-design-vue@^2.2.8 --save

2.需要使用<a-tree>的文件局部导入旧版本antd

import { Tree as TreeV2 } from 'ant-design-vue-v2';
// 引入 2.x 对应的样式（必须单独引入，否则样式错乱）
import 'ant-design-vue-v2/dist/antd.css';

3.使用TreeV2替换a-tree

<TreeV2
  ref="tree"
  checkable
  blockNode
  v-model:expandedKeys="expandedKeys"
  :replace-fields="replaceFields"
  :tree-data="treeData"
  :load-data="getLeafNodes"
  @expand="handleExpand"
  @select="openLeaf"
  @check="handleCheck"
  :checkedKeys="checkedKeys"
>
  <template #title="scoped">
    <van-icon name="cluster-o" :size="14" v-if="scoped.type === 1" />
    <van-icon name="user-o" :size="14" v-if="scoped.type === 0" />
    <span
      :class="{
        'mlr-10': true,
        'search-highlighted':
          scoped.deptName &&
          searchHighlightWord.trim() &&
          decryptAESGCM(scoped.deptName).includes(
            searchHighlightWord.trim()
          ),
      }"
      >{{ decryptAESGCM(scoped.deptName) }}
      <span v-if="scoped.deptId && scoped.type == 0"
        >({{ scoped.deptId }})</span
      >
    </span>
  </template>
</TreeV2>

即可。