vue-router 学习路程中的发现和积累

路由导航

vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航(相当于一个保安)。我们需要通过路由来进行一些操作，比如最常见的登录权限验证，当用户满足条件时，才让其进入导航，否则就取消跳转，并跳到登录页面让其登录。为此我们有很多种方法可以植入路由的导航过程：全局的, 单个路由独享的, 或者组件级的。

注：参数或查询的改变并不会触发进入/离开的导航守卫 (你可以通过观察 $route 对象来应对这些变化，或使用 beforeRouteUpdate 的组件内守卫。)

全局守卫

• 他的特点是所有路由配置的组件都会触发，直白点就是触发路由就会触发这些钩子函数.

• vue-router全局有三个守卫：

  • router.beforeEach 全局前置守卫 进入路由之前

  • router.beforeResolve 全局解析守卫(2.5.0+) 在beforeRouteEnter调用之后调用

  • router.afterEach 全局后置钩子 进入路由之后

beforeEach

在路由跳转前触发，参数包括 to , from , next（参数会单独介绍）三个，这个钩子作用主要是用于登录验证，也就是路由还没跳转提前告知，以免跳转了再通知就为时已晚。

to,from,next 这三个参数

• to: Route: 即将要进入的目标 路由对象即 this.$route,$