vue-router路由对象属性

vue路由对象为this.$route,下面详细列一下该对象属性的详细信息

属性名 类型 读写 说明
$route.path staring 只读

当前路由的名字(一般为#后面的部分,但不包含query查询值)

如:http://example.com/#/login?name=aa

this.$route.path;    //输出“/login”

$route.query object 只读

可访问携带的查询参数

如:this.$router.push({name: 'login', query:{name: 'you'}})

此时路由为:http://example.com/#/login?name=you

可直接访问this.$route.query.name;    //you

$route.params object 只读

路由转跳携带参数

如:this.$route.push({name: 'hello', params: {name: 'you'})

此时可访问this.$route.params.name;    //you

$route.hash string 只读 当前路径的哈希值,带#
$route.fullPath string 只读

完整的路径值

如:http://example.com/#/login?name=aa

this.$toute.fullPath;    //输出“/login?name=aa”

$route.name string 只读 命名路由的
$route.matched array 只读

当前路由下路由声明的所有信息,从父路由(如果有)到当前路由为止

$route.redirectedFrom string 只读

重定向来源

如:{ path: '*',redirect: {name: 'hello'}}

此时访问不存在的路由http://example.com/#/a会重定向到hello

在hello访问this.$route.redirectedFrom;    //输出“/a”

以上是路由对象的常见属性,基本的信息都涵盖了,且亲测

有新的再补充吧!

猜你喜欢

转载自blog.csdn.net/garrettzxd/article/details/80889235