vue3-element-admin三级路由嵌套问题

最新推荐文章于 2024-04-18 09:45:14 发布

im_backlit

最新推荐文章于 2024-04-18 09:45:14 发布

阅读量572

点赞数

分类专栏： vue 文章标签： vue.js 前端

本文链接：https://blog.csdn.net/weixin_47450691/article/details/133908404

版权

vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

目录结构

路由第三级是由路由第二级映射到第三级的最终路径，所以你得加个index.vue的文件，同时创建第三级目录并命名为children,和index.vue文件是同级的，第三级的目录放在children下面就好。

index.vue内容

<template>
  <router-view />
</template>

路由代码

{
        "path": "/personnel",
        "component": "Layout",
        "redirect": "/personnel/index",
        "meta": {
            "title": "人事系统",
            "icon": "homepage",
            "hidden": false,
            "roles": [
                "ADMIN"
            ],
            "keepAlive": true
        },
        "children": [
            {
                "path": "children/operateDepart",
                "component": "personnel/index",
                "redirect": "/personnel/children/operateDepart",
                "meta": {
                    "title": "运营部",
                    "icon": "",
                    "hidden": false,
                    "roles": [
                        "ADMIN"
                    ],
                    "keepAlive": true
                },
                "children": [
                    {
                        "path": "recruitManage-o",
                        "component": "personnel/children/operateDepart/recruitManage",
                        "meta": {
                            "title": "招聘管理",
                            "icon": "",
                            "hidden": false,
                            "roles": [
                                "ADMIN"
                            ],
                            "keepAlive": true
                        },
                        "children": [],
                        "name": "recruitManage-o"
                    },
                    {
                        "path": "riderManage-o",
                        "component": "personnel/children/operateDepart/riderManage",
                        "meta": {
                            "title": "骑手管理",
                            "icon": "",
                            "hidden": false,
                            "roles": [
                                "ADMIN"
                            ],
                            "keepAlive": true
                        },
                        "children": [],
                        "name": "riderManage-o"
                    }
                ],
                "name": "operateDepart"
            }
        ],
        "name": "personnel"
    }