点击侧边栏菜单跳转到main 页面

.home.vue页面 

需要在 <el-main>标签下增加第一个路由占位符 

因为登录的欢迎页面 和点击下的子菜单 会在同一个页面 

因此需要判断 获取路由路径 如果是/home 路径 则显示欢迎语(Devops管理系统) 如果不是则是路由占位符  

home.vue 中 

<el-main>
          <div class="mainTitle" v-if="$route.path==='/home'">Devops管理系统</div>
          <!-- 路由占位符-->
          <router-view></router-view>
</el-main>

 

router.ts 中定义两个 子菜单 加载这两个页面 

router.ts

// 登录成功之后home页路由
        path : '/home',
        name : 'home',
        component : () => import('@/views/Home.vue'),
        children: [
            {
                path: '/sys/deploy', component: ()=>import('@/sys/SysDeploy.vue'),

            },
            {
                path: '/sys/app', component: ()=>import('@/sys/SysApp.vue')
            }
        ]
        },

后端接口：

[
    {
        "id": 6,
        "url": "/",
        "path": "/home",
        "component": "Home",
        "name": "系统管理",
        "iconCls": "fa fa-windows",
        "meta": {
            "keepAlive": null,
            "requireAuth&