Vue路由守卫之组件内路由守卫
beforeRouteEnter,进入路由前。需要注意这里不能使用this,因为我们使用的是进入路由之前，那会组件还没创建，得不到this这个属性，所有我们只能使用过vm异步语句来让节点上树； <script> export default { data(){ return{ num : 10 } }, beforeRouteEnter:(to,from,next)=>{ next(vm=>{ alert(vm.num) }) }, } </script> 运行后可以看到，在使用beforeRouteEnter，使用的vm异步语句得到 beforeRouteLeave：离开路由之前可以被调用，可以访问里面的this属性！ <script> export default { data(){ return{ num : 10 } }, beforeRouteLeave (to, from, next) { if(confirm('确定离开吗？') === true){ next() }else{ next('aa') } } } </script> 运行后可以看到，使用beforeRouteLeave(离开路由之前)，系统会询问是否要离开，点击取消系统不会跳转，点击确定之后系统才会跳转离开。所以我们可以在离开路由之前做一些事情； 为大家奉上导航守卫完整的解析流程