• 路由对象是不可变 (immutable) 的,每次成功的导航后都会产生一个新的对象。不过你可以 watch (监测变化) 它。
  • 通过 this.$route 访问当前路由,还可以通过router.match(location) 的返回值、导航守卫的参数、scrollBehavior 方法的参数访问路由对象
// Home.vue
export default {
computed: {
username () {
// 我们很快就会看到 `params` 是什么
return this.$route.params.username
}
},
methods: {
goBack () {
window.history.length > 1
? this.$router.go(-1)
: this.$router.push('/')
}
}
}

$route.path

  • 字符串,对应当前路由的路径,总是解析为绝对路径,如 "/foo/bar"

$route.params

  • 一个 key/value 对象,包含了动态片段(:id匹配的键值)和全匹配片段(?),如果没有路由参数,就是一个空对象。

$route.query

  • 一个 key/value 对象,表示 URL 查询参数。例如,对于路径 /foo?user=1,则有 $route.query.user == 1,如果没有查询参数,则是个空对象。

$route.hash

  • 当前路由的 hash 值 (带 #) ,如果没有 hash 值,则为空字符串。

$route.fullPath

  • 完成解析后的 URL,包含查询参数和 hash 的完整路径。

$route.matched

  • 一个数组,包含当前路由的所有嵌套路径片段的路由记录 。路由记录就是初始化时配置中routes的对象副本数组 (还包括 children 数组中的配置)。
  • 路由记录可以是嵌套的,因此,当一个路由匹配成功后,他可能匹配多个路由记录。一个路由匹配到的所有路由记录会暴露为 $route 对象的 $route.matched 数组
const router = new VueRouter({
routes: [
// 下面的对象就是路由记录
{ path: '/foo', component: Foo,
children: [
// 这也是个路由记录
{ path: 'bar', component: Bar }
]
}
]
}) // 当 URL 为 /foo/bar,$route.matched 将会是一个包含从上到下的所有对象 (副本)。

$route.name

  • 当前路由的名称,如果有的话。

$route.redirectedFrom

  • 如果存在重定向,即为重定向来源的路由的名字。

路由对象route的更多相关文章

  1. asp.net MVC 路由机制 Route

    1:ASP.NET的路由机制主要有两种用途: -->1:匹配请求的Url,将这些请求映射到控制器 -->2:选择一个匹配的路由,构造出一个Url 2:ASP.NET路由机制与URL重写的区 ...

  2. Vue-Router路由 Vue-CLI脚手架和模块化开发 之 使用路由对象获取参数

    使用路由对象$route获取参数: 1.params: 参数获取:使用$route.params获取参数: 参数传递: URL传参:例 <route-linke to : "/food ...

  3. Vue-Router路由Vue-CLI脚手架和模块化开发 之 使用props替代路由对象的方式获取参数

    在上一章博文中使用路由对象$route获取参数时,组件和路由对象耦合,在这篇博文中就可以使用props来进行解耦: 1.在组件中使用props选项定义数据,接收参数: 2.在路由中,使用props选项 ...

  4. vue路由对象($route)参数简介

    路由对象在使用了 vue-router 的应用中,路由对象会被注入每个组件中,赋值为 this.$route ,并且当路由切换时,路由对象会被更新. so , 路由对象暴露了以下属性: 1.$rout ...

  5. ASP.NET Web API 路由对象介绍

    ASP.NET Web API 路由对象介绍 前言 在ASP.NET.ASP.NET MVC和ASP.NET Web API这些框架中都会发现有路由的身影,它们的原理都差不多,只不过在不同的环境下作了 ...

  6. vue常用的路由对象

    官网上解释:一个路由对象表示当前激活的路由的状态信息 路由对象,在组件内即this.$route,存着一些与路由相关的信息,当路由切换时,路由对象会被更新 //如果要在刷新页面时候通过路由的信息来操作 ...

  7. ASP.NET MVC学习(一)之路由篇Route

    什么是路由 通过[路由]配置,路由可以规定URL的特殊格式,使其达到特殊效果. 在ASP.NET MVC框架中,通过路由配置URL,使用户的URL请求可以映射到Controller下的action方法 ...

  8. vue 路由对象(常用的)

    路由对象 在使用了 vue-router 的应用中,路由对象会被注入每个组件中,赋值为 this.$route ,并且当路由切换时,路由对象会被更新. 路由对象暴露了以下属性: $route.path ...

  9. vue 路由对象

    路由对象在使用了 vue-router 的应用中,路由对象会被注入每个组件中,赋值为 this.$route ,并且当路由切换时,路由对象会被更新. so , 路由对象暴露了以下属性: 1.$rout ...

随机推荐

  1. Python基础:二、python介绍

    Python崇尚优美.清晰.简单,是一个优秀并广泛使用的语言 python的创始人为GuidovanRossum.1989年圣诞节期间,Guido再阿姆斯特丹未来打发时间,决心开发一个新的脚本解释程序 ...

  2. 添加ssl证书

    ssl证书会使你的网站更加安全,防止isp在你的网站显示时添加广告,浏览网页时地址栏左边有一个绿色安全的图标,使用户感觉更加安全放心. 颁发ssl证书的机构很多,有收费的,也有免费的.当然对于自己的小 ...

  3. Oracle报错TNS-12532: TNS:invalid argument

    今天一个同事遇到了一个oracle问题,在数据库本机通过sqlplus登录sys用户时报TNS-12532: TNS:invalid argument,这个错误. 造成这个错误的原因主要有三个,一般排 ...

  4. 转载一篇阿里云Terraform 开发指南

    连接:https://www.jianshu.com/p/0aebea117cae 是一个比较详细的开发指南          

  5. Centos7下使用yum源安装zabbix Server

    系统:Centos7 zabbix版本:4.2   一.Zabbix Server端   1.安装仓库 rpm -ivh https://repo.zabbix.com/zabbix/4.2/rhel ...

  6. Inno Setup打包带有MSI文件的程序

    [Setup] ; 注: AppId的值为单独标识该应用程序. ; 不要为其他安装程序使用相同的AppId值. ; (生成新的GUID,点击 工具|在IDE中生成GUID.) AppId={{47A1 ...

  7. 剑指offer 8.递归和循环 跳台阶

    题目描述 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法(先后次序不同算不同的结果).   解题思路一: a.如果两种跳法,1阶或者2阶,那么假定第一次跳的是 ...

  8. JS:Math 对象方法

    Math 对象方法方法     描述Math.ceil(x)     对数进行上舍入.(向上取整:大于等于x的最小整数)Math.floor(x)     对数进行下舍入.(小于等于x的最大整数)Ma ...

  9. nil和Nil及NULL的区别(仅作记录)

    今天在研究红黑树的时候一直提到一个NIL节点,百度了一下,这里仅作记录 nil是一个对象值,如果要把一个对象设置为空的时候就用nil.Nil是一个类对象的值,如果要把一个Class类型的对象设置为空的 ...

  10. Gradle的使用及下载

    1在官网下载Gradle 基本学这个的都有JDK和JVM所以只需要在环境变量中配置即可 点击hettp://start.spring.io/即可使用