背景说明
需要是这样的：
假设这个路由是/aa
- 它可以通过其它路由跳转进入 或 访问路由标签进入。如：通过路由
/bb跳转进入到路由/aa：在路由/bb中写如下代码router.push({ path: '/aa' }) - 不允许通过空白页进入。如 由路由
/bb跳转到路由/aa后，生成起来的路由访问页面的地址为：http://localhost:8080/aa?name=a&title=b：- 不允许将这个地址复制出来，在一个新的浏览器页面中打开
- 在当前的页面中，F5或者Ctrl+R刷新，页面不会丢失
要求
- 页面跳转 或 路由标签正常访问
- 空白页直接访问，跳转到
/401
效果
- 页面跳转或路由标签访问
- 空白页访问
实现
通过结合路由的beforeEnter守卫和window.performance.navigation.type，实现控制路由是否可以正常跳转。
说明：
window.performance.navigation.type = 1：页面刷新window.performance.navigation.type = 0：首次进入，空白页面
{
path: '',
component: Layout,
meta: { title: '路由1', icon: 'dashboard' },
children: [
{
path: 'aa',
component: () => import('@/views/aa.vue'),
name: 'aa',
meta: { title: '路由1-aa', icon: 'dashboard', requiresRouteNavigation: true },
beforeEnter: (to, from, next) => {
let windowType = window.performance.navigation.type
// windowType = 0, 首次进入
// windowType = 1, 页面刷新
if(!windowType) {
next('/401')
} else {
next()
}
}
},
]
}
