vue官网给
this.$router
和this.$route
下的定义:
- this.$router
router 实例。
- this.$route
当前激活的路由信息对象。这个属性是只读的,里面的属性是 immutable (不可变) 的,不过你可以 watch (监测变化) 它。
this.$router:是全局路由器 router 的实例,可以在任何组件内进行访问,路由实例里面有很多属性
和方法
,下面举个例子:
// 我们常用到的路由跳转
this.$router.push('/home');
更多属性和方法,大家可以去 vue 官网查询,具体地址
this.$route:是当前页面的路由信息对象,包含了当前 URL 解析得到的信息,还有 URL 匹配到的路由记录 (route records),也有一些属性,下面举个例子:
this.$route.query.index // 接收通过 query 传过来的index
综合应用:
我们可以在任何组件内通过 this.$router
访问路由器,也可以通过 this.$route
访问当前路由:
// 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('/')
}
}
}