Vue（四）-路由

路由的使用分为三个步骤：

1. 定义路由路径集合
   var routes = [{path: ‘’, component:}, …]
2. 新建一个路由对象
   var routers = new VueRouter({routes})
3. 将路由挂载到Vue实例上
   new Vue({
   el: ‘#app’,
   routers
   })

传值的方式有两种

1. 方式1

//路由路径的定义
var routes = [{path: ‘/home/:name/:id’, component:}, …]

//传值
<router-link to=’/home/tom/123’>

//使用
<div>{{ this.$route.parames.name }} – {{ this.$route.parames.id }}</div>

//路由路径的定义
var routes = [{path: ‘/home’, component:}, …]

//传值
<router-link to=’/home?name=tom&id=123’>

//使用
<div>{{ this.$route.query.name }} – {{ this.$route.query.id }}</div>