vue-路由：在单页面中切换多个组件，切换多个页面。可以动态的渲染组件，
使用路由的步骤：
1：创建组件
var rter={
template:`
<div>第一个路由</div>
`
2:配置路由信息
var routes =[
{
path:'/rter',
component:rter
}
]
3:创建路由对象，将第二步配置的路由信息对象注册到路由对象
var router = new VueRouter({
routes
})
4:将路由对象注册到根组件上
new Vue({
el:'#app',
router
})
5:在body的id为app的标签下面加入router-link标签
<router-link to='/rter'>rter</router-link>
6:添加路由渲染出口
<router-view></router-view>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/vue.js"></script>
<script src="js/vue-router.js"></script>
</head>
<body>
<div id="app">
<router-link to='/rter'>the first one</router-link>
<router-view></router-view>
</div>
</body>
</html>
<script>
var rter = {
template:`
<div>第一个路由</div>
`
}
var routes = [
{
path:'/rter',
component:rter
}
]
var router = new VueRouter({
routes
})
new Vue({
el:"#app",
router
})
</script>