vue学习 33路由精讲之导航守卫(全局守卫)

最新推荐文章于 2022-06-15 10:58:13 发布

扫地鼠Gordon

最新推荐文章于 2022-06-15 10:58:13 发布

阅读量253

点赞数

分类专栏： vue 文章标签：全局守卫

本文链接：https://blog.csdn.net/qq_28137309/article/details/89812783

版权

vue 专栏收录该内容

48 篇文章 2 订阅

订阅专栏

使用场景：系统未登录，进入除登录外的任何功能，提示未登录并跳转到登录界面。

router.beforeEach()进入组件之前

const router = new VueRouter({
	routes,
	mode: 'history'
})

// 全局守卫(to:要进入到那个路由里面去；from：你从哪个路由离开；next:对应的一个函数)
router.beforeEach((to, from, next) => {
	// alert("还没有登陆，请先登录");
	// next();
	
	// 判断store.gettes.isLogin === false
	 if(to.path == '/login' || to.path == '/register'){
		 next();
	 } else {
		 alert("还没有登陆，请先登录");
		 next('/login');
	 }
})

new Vue({
	router,
	el: '#app',
	render: h => h(App)
})