Vue路由守卫

1.路由守卫

先说我的理解，路由守卫类似一个安保系统，要向进入园区，必须经过安保的同意，同意了就放行，继续操作，那么路由守卫也是一样的

包含 全局守卫 独享守卫 组件内守卫

1.1 全局守卫

应用于整个页面，处理对应的事件，分为前置守卫和后置守卫

• to：进入到哪个路由去

• from：从哪个路由离开

• next：路由的控制参数，常用的有next(true)和next(false)

<!--1.定义组件-->
let comA ={
    data(){},
    template:``,
    created(){
    this.id = this.$route.params.id
    this.username = this.$route.params.username
    }
}
<!--2.定义路由-->
let router = new VueRouter({
    routes:
     [
      {path:'/user:id/username/:username',component: comA}
     ]
})
<!--4.绑定路由全局守卫 前置-->
router.beforeEach((to,from,next)=>{
    console.log('前置',to,from)
    next();
})
<!--绑定路由全局守卫 后置-->
ro