点击侧边栏菜单跳转到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&