1、vue-router
- 一旦
Vue.use(VueRouter)
之后,有两大对象被挂载到Vue
的实例对象(每个Vue组件
)this
当中this.$route
对象:只读,具备以下信息$route.path
:字符串
,等于当前路由对象的路径,会被解析为绝对路径,如"/home/news"
$route.params
:对象
,包含路由中的动态片段和全匹配片段的键值对$route.query
:对象
,包含路由中查询参数的键值对。例如,对于/home/news/detail/01?favorite=yes
,会得到$route.query.favorite == 'yes'
$route.router
: 路由规则所属的路由器(以及其所属的组件)$route.matched
:数组
,包含当前匹配的路径中所包含的所有片段所对应的配置参数对象。$route.name
: 当前路径的名字,如果没有使用具名路径,则名字为空
<div>
<p>当前路径:{{$route.path}}</p>
<p>当前参数:{{$route.params | json}}</p>
<p>路由名称:{{$route.name}}</p>
<p>路由查询参数:{{$route.query | json}}</p>
<p>路由匹配项:{{$route.matched | json}}</p>
</div>
复制代码
- `this.$router`对象:`router 实例` 具备功能函数
复制代码