VUE路由守卫

所谓的路由守卫就是当我们进⾏⻚⾯跳转的时候会触发的钩⼦函数,
我们把它称之为vue路由守卫

vue的路由守卫分为三种：全局路由守卫、组件内路由守卫和路由独享守卫

1.每个守卫方法接收三个参数：

1. to : 即将要进入的目标 路由对象

2. from : 当前导航正要离开的路由

3. next : 一定要调用该方法来 resolve 这个钩子。执行效果依赖 next 方法的调用参数（是否接着往下执行，若不写next（），则页面不会往下执行

2.全局路由守卫

全局路由守卫分为两种：全局前置守卫和全局后置钩子

全局前置守卫
   

    router.beforeEach((to, from, next) => {
    	next()
    })

全局后置钩子
你也可以注册全局后置钩子，然而和守卫不同的是，这些钩子不会接受 next 函数也不会改变导航本身

      router.afterEach( (to,from )=> {
       console.log(to);
       console.log(from);
     }) 

afterEach用的少，beforeEach用的多

2.路由独享守卫

在router文件夹里的index.js里相对应的路由中写入

  beforeEnter: (to, from, next) => {
        next()
      }

 3.组件内路由守卫

要设置的组件内部使用，和data同级

组件内路由守卫有三种方法：

beforeRouteEnter：
 

  beforeRouteEnter ((to, from, next)=> {
    next()
  })

beforeRouteUpdate :
   

	 beforeRouteUpdate ((to, from, next) => {
		   next()
		  })

beforeRouteLeave :
   

	 beforeRouteLeave((to, from, next) => {
	   next()
	  })

路由独享守卫，守的是path

组件内部守卫，守的是component