vuerouter获取嵌套路由每个子路由的完整path,而不是当前子路由path,解决无限级菜单问题的怎么搞?

Question

无限级菜单需要获取每个子路由完整的path(除域名)，目前发现获取的是相对path

    <label v-for="menu in data" :key="menu.name">
      <el-sub-menu :index="menu.path" v-if="menu.children">
        <template #title>
          <el-icon><location /></el-icon>
          <span>{{menu.meta.title}}</span>
        </template>
        <MenuTree :data="menu.children"></MenuTree>
      </el-sub-menu>
      <el-menu-item v-else :key="menu.name" :index="menu.path">
        <span slot="title">{{menu.meta.title}}</span>
      </el-menu-item>
    </label>

                }
            ]
        },

点击菜单的时候

Answer 1

主要还看你是怎么操作跳转的。如果你跳转的时候是类似这样的 this.$router.push(path)，那么就会造成你这样的问题。因为是相对路径，会直接追加在当前的 url 后面。

如果想要避免这样的情况，路由表维护的时候就是完整路径就可以了。要不然使用 name 跳转也是可以的，只是说 name 弄不好也会重合。