vue2树组件el-tree，实现点击节点页面跳转功能

vue2树组件el-tree，实现点击节点页面跳转功能，每个节点前面加图标，类似于el-menu菜单切换操作

学到了

该回答引用GPT:
对于vue2的树组件el-tree，实现点击节点页面跳转功能，可以通过监听节点点击事件，并在事件回调函数中利用vue-router路由跳转实现。首先需要在树组件中的节点模板中添加图标，例如使用elementUI的Icon组件实现，然后在Tree组件中设置node-key属性，指定每个节点的唯一标识，方便在事件回调函数中获取节点信息。代码如下：

<template>
  <el-tree
    :data="treeData"
    :node-key="nodeKey"
    :expand-on-click-node="false"
    @node-click="handleNodeClick"
  >
    <template v-slot="{node}">
      <span>
        <i class="el-icon-folder"></i>
        {{node.label}}
      </span>
    </template>
  </el-tree>
</template>

<script>
  import { mapActions } from 'vuex'

  export default {
    data() {
      return {
        treeData: [
          {
            id: 1,
            label: '节点1'
          },
          {
            id: 2,
            label: '节点2',
            children: [
              {
                id: 3,
                label: '节点3'
              },
              {
                id: 4,
                label: '节点4'
              }
            ]
          }
        ],
        nodeKey: 'id'
      }
    },
    methods: {
      ...mapActions(['setActiveNode']),
      handleNodeClick(data) {
        this.setActiveNode(data) // 存储当前激活节点信息
        this.$router.push('/detail') // 路由跳转到详情页
      }
    }
  }
</script>

在事件回调函数中，我们可以通过调用vue-router实例的push方法进行路由跳转，具体跳转的路径需要根据每个节点的不同情况进行定制化。此外，上述代码中还使用了Vuex来存储当前激活节点信息，以实现类似于el-menu的菜单切换操作。
如还有疑问，可留言帮助解决。