【vue】导航守卫
什么是导航守卫
在vue路由切换过程中对行为做个限制
- 全局前置守卫
route.beforeEach((to, from, next)) => {
// to是切换到的路由
// from是正要离开的路由
// next控制是否允许进入目标路由
next(false); //不允许
}
- 路由级别的导航守卫
const routes = [
{
path: '/User',
name: 'User',
beforeEnter: (to, from, next) => {
next(false);
}
},
]
- 组件内部的导航守卫
在 User.vue组件中加入
export default {
beforeRouterEnter(to, from, next) {
next(false);
}
}
- 离开路由
beforeRouterLeave(to, from, next) {
if(this.isconfirmed) {
next();
} else {
if (confirm('确定要离开吗')) {
next();
}else {
next(false);
}
}
}