如何在`<a-tree>`中实现单击节点后的详情跳转？

在`<a-tree>`中实现单击节点后的详情跳转，你需要关联每个节点到一个具体的详细信息页面的数据，并在点击事件处理器中处理这个导航。你可以设置每个节点的一个额外属性，如`key`或`href`，指向对应的详细页面。下面是一个示例：

<a-tree
  :data="categoryTreeWithLinks" // 数据中包含链接信息
  :default-expand-all="true"
  :node-key="nodeKey"
  @click-node="handleNodeClick"
></a-tree>

<script>
export default {
  data() {
    return {
      categoryTreeWithLinks: [
        {
          title: '父节点1',
          key: 'parent1',
          href: '/productDetail/1', // 链接地址
          children: [...]
        },
        ...
      ],
      nodeKey: 'id', // 根据需要选择节点唯一标识
    };
  },
  methods: {
    handleNodeClick(node) {
      // 跳转到对应详情页面
      window.location.href = node.href; // 或者使用router.push
    },
  },
};
</script>

当用户点击一个节点时，`handleNodeClick`方法会被调用，通过`node.href`属性引导浏览器跳转到指定的详情页面。