vue router 入门笔记
tips：
- components优先级大于component，即当一个route对象里同时配置了component和components时component视为无效
- 即使route对象有name属性，也要配置一个path属性。name属性只是配对用的，path是要直接打到url上的。
- router-link的to属性会和首先匹配的route对象匹配，即to属性和多个route对象匹配时，使用先定义的route对象。
- to属性和path去配对，name属性和name属性配对。因为每个link只有一个to属性，所以不存在一个link既有path又有name的情况。
router-link（路由到不同配置）
根据to属性的path值或name值，来匹配routes数组中唯一一个route对象（若匹配到多个则使用先匹配的）。以根据不同route对象来渲染页面。
const routes = [{path: '/path1',component: {template: '<div>foo</div>'}
},{path: '/path2',component: {template: '<div>bar</div>'}
}]route对象（配置路由走向）
用来定义不同路由下，一个或多个router-view渲染哪个组件。以及可以通过children属性配置嵌套的路由的route对象。
一个view：
const routes = [{ path: '/foo', component: Foo },{ path: '/bar', component: Bar }
]多个view：
{path: '/',components: {default: Foo, // 没有name属性的view用Foo组件a: Bar, // name值为a的view用Bar组件b: Baz // name值为b的view用Baz组件}
}嵌套的view：
{path: '/user/:id',component: User,children: [ 相当于在children属性上再配置一个routes数组{// 当 /user/:id/profile 匹配成功，// UserProfile 会被渲染在 User 的 <router-view> 中path: 'profile',component: UserProfile},{// 当 /user/:id/posts 匹配成功// UserPosts 会被渲染在 User 的 <router-view> 中path: 'posts',component: UserPosts}]
}多个路由匹配一个route对象并把路由信息传入组件
<router-link to="/user/001">Go to Foo</router-link>
<router-link to="/user/002">Go to Bar</router-link>const router = new VueRouter({routes: [// 动态路径参数 以冒号开头{ path: '/user/:id',component: {template: '<div>User {{ $route.params.id }}</div>'} }]
})router-view（路由接收者）
根据匹配的route对象，按照component对象定义的view与组件的匹配关系渲染组件。
一个view：
<router-view></router-view>多个view：
指一个route对线同时控制多个视图。
其中的class会渲染在组件的根元素上。
<router-view class="view one"></router-view>
<router-view class="view two" name="a"></router-view>
<router-view class="view three" name="b"></router-view>s
