Vue 组件内路由守卫

Vue 组件内路由守卫

beforeRouteEnter(to,from,next){}
beforeRouteLeave(to,from,next){}

路由组件
Home.vue

<script>
export default{
name:'About',

//通过路由规则，进入该组件时被调用
beforeRouteEnter(to,from,next){
//to是你要跳转到这个路由组件
//from是你从哪个路由组件跳转过来的
//可以在next()前设置条件，当符合条件就放行，比如：
if(localStorage.getItem('school')==='atguigu'){
		next()
	}
}
//通过路由规则，离开该组件时被调用
beforeRouteLeave(to,from,next){
//to是你要跳转到别的路由组件
//from是这个路由组件
//可以在next()前设置条件，当符合条件就放行，比如：
if(localStorage.getItem('school')==='atguigu'){
		next()
	}
}
}
</script>

beforeRouteEnter的to和beforeRouteLeave的from的信息都是和Home.vue相关的