vue-router 鉴权 守卫

路由守卫

路由守卫分三种：

1. 全局路由守卫

全局：任何组件都能守卫到
to是去那个页面
from从哪个页面来
next进入这个页面/下一步

//全局鉴权
router.beforeEach((to, from, next) => { //守卫全局
	 //to是去那个页面
	 //from从哪个页面来
 	 //next进入这个页面/下一步
})

2. 组件路由守卫

在组件内部使用，只能守卫单独的组件

  beforeRouteEnter (to, from, next) {
 // 注意进入路由之前，组件渲染实例还没完成，还不可以使用this访问组件 ，
 // 可以使用vm
    console.log(to);
    console.log(from);
    console.log(next);
    console.log(next(vm));
    console.log(this);//undefind
    next(vm => {})
  }
	
	//同一个页面，刷新时调用
	 beforeRouteUpdate
	//离开调用
	beforeRouteLeave

3. 路由独享守卫

我们可以写在存放路由的地方

   {
      path: '/detail/:id',
      name: 'detail',
      component: () => import('./views/detail/detail.vue'),
      beforeEnter(to,from,next){next()}
    },