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

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

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)
})

 

你可能感兴趣的:(vue)