[JavaScript知识库]vue-router 鉴权 守卫

一、全局路由守卫

所谓全局路由守卫，就是小区大门，整个小区就这一个大门，你想要进入其中任何一个房子，都需要经过这个大门的检查

//main.js中设置全局导航守卫,所有路由都会经过 

//全局前置守卫beforeEach,  全局后置守卫afterEach()
 router.beforeEach((to,from,next)=>{

?    next()  //决定页面是否继续向下走    next(true);

 });

二、组件路由守卫

// 跟 methods: {}等同级别书写，组件路由守卫是写在每个单独的 vue 文件里面的路由守卫

beforeRouteEnter (to, from, next) {

// 注意，在路由进入之前，组件实例还未渲染，所以无法获取 this 实例，只能通过 vm 来访问组件实例

next(vm => {})

}
beforeRouteUpdate (to, from, next) {

// 同一页面，刷新不同数据时调用，

}

beforeRouteLeave (to, from, next) {

// 离开当前路由页面时调用

}

三、路由独享守卫

router.js（路由页面）中定义 {  

  path: "nxp", 

  name: 'nxp',


  beforeEnter(to,from,next){        next();    
  } 
  }

to：即将要进入的路由对象；from：当前导航正要离开的路由；next：进行管道中的下一个钩子，必须调用