Vue中路由守卫一共有三种，一种是全局路由守卫，一种是组件内路由守卫，一种是组件内路由守卫路由器专属卫士。1、全局路由守卫所谓全局路由守卫，就是社区的大门。整个小区只有一扇门。想要进入任何一座房屋，都需要通过这道大门的检验。全局路由守卫有两种：一种是全局前卫，一种是全局后卫router.beforeEach((to,from,next)=>{console.log(to)=>//去哪个页面？console.log(from)=>//从哪个页面来的？next()=>//一个回调函数}router.afterEach(to,from)={}next():回调函数参数配置next(false):中断当前的导航，如果浏览器的URL发生变化（可能是用户手册或者浏览器的后退按钮），那么URL地址会被重置为from路由next('/')或者next({path:'/'}):跳转到不同的地址，当前导航中断，然后进行新的导航。您可以将任何位置对象传递给next，并且您可以设置选项，例如replace:true、name:'home'，以及在router-link的toprop或router.push中使用的任何选项。2.组件路由守卫//写在methods同一层级：{}，组件路由守卫是写在每个单独的vue文件中的路由守卫beforeRouteEnter(to,from,next){//注意在路由进入之前，组件instance还没有被渲染，所以无法获取This实例，只能通过vm访问组件实例next(vm=>{})}beforeRouteUpdate(to,from,next){//同一个页面，刷新时调用不同的数据，}beforeRouteLeave(to,from,next){//离开当前路由页面时调用}3.独占路由守卫独占路由守卫是在路由配置页面单独为路由配置的守卫exportdefaultnewVueRouter({routes:[{path:'/',name:'home',component:'Home',beforeEnter:(to,from,next)=>{//...}}]})vue-router提供导航hooks：全局前导航钩子beforeEach和全局后导航钩子afterEach，它们会在路由abo前后触发想改变。所以判断用户是否登录需要在beforeEach导航钩子中进行判断。每个守卫方法接收三个参数：to:Route:即将进入路由对象的目标from:Route:当前导航离开的路由next:Function:必须调用此方法来解析此钩子。在项目中，一些关于路由跳转的信息判断，一般都是在beforeEach钩子函数中进行。判断是否登录，是否获取相应的路由权限等。想了解更多前端面试相关技术知识，欢迎关注小编的前端培训技术专栏！
