在vue-router中设置和获取参数的方法

vue-router中传递参数

1.通过设置路由name属性，用{{ $route.name }}获取。

例如：
设置：
{ path: '/', name: ' Home', component: home }
获取：

$route.name

这里要留意的是：
1.{{$route.name}}中route的拼写，并不是router。
2.{{$route.name}}中获取的name值是路由中设置的name值。

---

2.通过设置router-link中params，用 {{ $route.params }} 获取。

例如1：
设置：

1.路由：

{ path: 'first', name: 'First - 1', component: first1 }

2.router-link：

firstfirst

获取：

first1 获得参数:{{$route.params.id}}

这里要留意的是：
1.router-link中使用的是to的绑定前面要加“:”。
2.目标路由和目标router-link中需要设相同的name。
3.{{$route.name}}中route的拼写，并不是router。

例如2：
设置：
1.路由：
{ path: '/:id', component: home }
2.router-link：

url-params传参

获取：
{{$route.params.id}}

这里要留意的是：
1.:id不要忘记了“:”。
2.这里相对于例1不需要在路由中设置name。
3.这里的:id为first。
4.{{$route.name}}中route的拼写，并不是router。

---

3.通过设置router-link中query,用{{ $route.query }}获取。

例如：

设置：

query传参

获取：

{{$route.query.aaa}}