vue-router的属性及使⽤
学习vue-router⾸先要认识的两个属性 $router 和 $route。
$router指的是router实例，$route则是当前激活的路由信息对象，是只读属性，不可更改，但是可以watch（监听）。
在浏览器中分别打印出$router 和 $route
$router：
属性：
$router.app ：配置了router的Vue根实例
$de：路由模式，这⾥是hash
$router.currentRoute：当前路由的路由信息对象，包含了当前匹配路由的信息
⽅法：
router.addRoutes(routes)：动态添加路由规则，参数为符合routes选项要求的数组。
router.beforeEach(to,from,next) ：全局前置守卫
router.beforeEach((to,from,next)=>{
//...
})
  当路由改变时，全局前置守卫执⾏，接受三个参数，to，from，next，分别代表即将要进⼊的⽬标路
由，当前要离开的路由，和回调函数next()。next的执⾏效果依赖于参数。next()，执⾏下⼀个钩⼦，若钩⼦执⾏完毕，导航状态是confirm；next(false)中断当前导航，回到from路由对应的地址；next({path:'/'})，跳转到⾃定义路由地址。next(error)，如果传⼊⼀个error实例，则导航终⽌并将错误传递给Error()注册过的回调。
router.beforeResolve()：全局解析守卫 , 在导航被确认之前，且在锁头组件内守卫和异步路由组件被解析之后调⽤，参数和全局前置守卫相同；
router.afterEach()：全局后置守卫
router.afterEach((to,from)=>{
//....没有next()函数参数，也不会改变导航本⾝
})
<(n)：接受⼀个整数作为参数，类似(n)，在浏览器历史记录中前进或后退⼏步
router.push( location )：跳转导航的⽅法，这种⽅法会向history栈添加⼀个新的记录
router.back()：相当于(-1)
router.forward()：相当于(1)
  1、错误在⼀个路由守卫函数中被同步抛出
  2、错误在⼀个路由守卫函数中通过调⽤next(error)的⽅式异步捕获并处理
  3、渲染⼀个路由的过程中，需要尝试解析⼀个异步组件时发⽣错误
$route：
route是路由信息对象，包含了当前路由的各种信息。路由对象是不可更改的，每次路由导航成功后都会产⽣⼀个新的对象。
html href属性router.match（location）的返回值也是⼀个路由信息对象，导航守卫的参数to，from也是路由信息对象。
属性：
$route.fullPath ：完成解析后的url，包含查询参数和hash的完整路径
$route.path：路径，字符串类型，解析为绝对路径
$route.hash：当前路由的hash值（带#号的），如果没有hash值则为空字符串
$route.name：当前路由的名称，如果有的话（⽤于命名路由）
$route.params：⼀个键值对对象，路由参数
$route.query：⼀个键值对对象，表⽰url查询参数
$route.matched：⼀个包含了当前路由的所有嵌套路径⽚段的路由记录（routes配置数组中的对象副本）
$directedFrom：重定向来源的路由的名字，如果存在重定向的话。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。