使用el-menu路由不调转
<el-menu active-text-color="#ffd04b"
background-color="#545c64"
text-color="#fff"
class="el-menu-verticaldemo layout-menu"
:collapse="isCollapse"
@open="handleOpen"
router
></el-menu>
- 需要在 el-menu 中添加 router
- 配置
el-menu-item
上的 route 跳转路径和 index 然后路由正常跳转
<el-menu-item :route="{name:c.path}"
:index="c.path"> {{c.meta.title}}
</el-menu-item>
在某个页面输入不存在的路径页面跳转
- 配置404页面在匹配不到路由的时候跳转到404
- 跳转到首页
router.beforeEach(async (to, from, next) => { if (to.matched.length === 0) { //如果未匹配到路由 //如果上级也未匹配 到路由则跳转登录页面,如果上级能匹配到则转上级路由 from.name ? next({name: from.name}) : next('/'); } else { next(); //如果匹配到正确跳转 } })
- 页面在刷新的时候没有停留在当前页面 返回了首页
匹配
*
一定要写在所有路由最后{path: '/:pathMatch(.*)', hidden: true, redirect: '/'} //当用户输入页面链接错误或者没有该页面时,显示该路径页面