if( !isGetRouter ){ initRouter( menuStore.menuList ) if( to.matched.length == 0 ){ router.push( to.fullPath ); } }
时间: 2024-03-30 07:38:36 浏览: 134
这段代码是一个路由守卫中的逻辑,作用是在用户访问某个路由前检查是否获取到路由配置信息。如果还没有获取到路由信息,则调用 `initRouter` 方法初始化路由,然后根据当前访问的路由地址 `to.fullPath`,通过 `router.push` 方法将用户重定向到相应的路由页面。其中 `to.matched.length == 0` 的判断是为了避免将用户重定向到已匹配的路由地址上。
相关问题
this.$store.state.router.menulist
这是一个获取 Vuex 状态管理中的 `router.menulist` 的代码。`$store` 是 Vue.js 中的全局状态管理对象,`state` 是其中的一个属性,用于存储应用程序的状态。`router.menulist` 是 `state` 对象中的一个属性,用于存储路由菜单列表的数据。所以这段代码的作用是访问并获取路由菜单列表的数据。
const router = new Router({ mode: 'hash', scrollBehavior: () => ({ y: 0 }), isAddDynamicMenuRoutes: false, // 是否已经添加动态(菜单)路由 routes: globalRoutes.concat(mainRoutes) }) router.beforeEach((to, from, next) => { // 添加动态(菜单)路由 // 1. 已经添加 or 全局路由, 直接访问 // 2. 获取菜单列表, 添加并保存本地存储 if (router.options.isAddDynamicMenuRoutes || fnCurrentRouteType(to, globalRoutes) === 'global') { next() } else { http({ url: http.adornUrl('/sys/menu/nav'), method: 'get', params: http.adornParams() }).then(({ data }) => { if (data && data.code === 0) { fnAddDynamicMenuRoutes(data.menuList) router.options.isAddDynamicMenuRoutes = true sessionStorage.setItem('menuList', JSON.stringify(data.menuList || '[]')) sessionStorage.setItem('permissions', JSON.stringify(data.permissions || '[]')) next({ ...to, replace: true }) } else { sessionStorage.setItem('menuList', '[]') sessionStorage.setItem('permissions', '[]') next() } }).catch((e) => { console.log(`%c${e} 请求菜单列表和权限失败,跳转至登录页!!`, 'color:blue') router.push({ name: 'login' }) }) } })
这段代码是一个Vue Router的配置,主要包括路由配置和路由守卫。在路由配置中,`mode`设置为'hash',表示使用URL的hash来进行路由跳转;`scrollBehavior`函数用于在每次路由切换时滚动到页面的顶部;`isAddDynamicMenuRoutes`用于标记是否已经添加了动态菜单路由;`routes`是一个数组,包含了全局路由和主要路由。
在路由守卫中,`beforeEach`函数会在每次路由切换之前被调用。首先会判断是否已经添加了动态菜单路由或者当前路由为全局路由,如果是,则直接访问该路由;否则,会发送一个HTTP请求获取菜单列表,并将菜单列表添加到路由配置中,并保存在本地存储中。接着,会将`isAddDynamicMenuRoutes`设置为true,表示已经添加了动态菜单路由,并将菜单列表和权限保存在`sessionStorage`中。最后,会调用`next`函数将导航转到目标路由。如果获取菜单列表和权限失败,则会在控制台输出错误信息,并跳转到登录页。
需要注意的是,这段代码中使用了一些自定义的函数和变量,比如`fnCurrentRouteType`用于判断当前路由的类型,`http`用于发送HTTP请求,`fnAddDynamicMenuRoutes`用于添加动态菜单路由。这些函数和变量的实现没有在代码中给出。
阅读全文