vue中的路由是实现spa的基础 spa:一个项目只有一个html之前实现页面跳转，需要用到a 现在用router-link替换

1、基本路由
①首先在body中设置相关的路由

		<div id="app">
			<ul>
				<li>
					<router-link to="/index">
						主页
					</router-link>					
				</li>
				<li>
					<router-link to="/list">
						分类
					</router-link>
				</li>
				<li>
					<router-link to="/my">
						我的
					</router-link>
				</li>
			</ul>
			
			<!-- 渲染跳转页面的内容 -->
			<router-view></router-view>
		</div>

②body中定义相关的模板

		<!-- 定义模板 -->
		<template id="index">
			<div>
				<h1>首页的内容</h1>
				<router-link to="/miao">秒杀</router-link>
		     	<router-view></router-view>
			</div>
			
		</template>
		
		<template id="list">
			<h1>分类的内容</h1>
		</template>
		
		<template id="my">
			<h1>我的内容</h1>
		</template>
		
		<template id="miao">
			<h1>这是秒杀内容</h1>
		</template>

③script中创建相关对象

		var index={
			template:'#index'
		}
		var list={
			template:'#list'
		}
		var my={
			template:'#my'
		}
		var miao={
			template:'#miao'
		}

④定义相关的路由在script中

		// 定义路由
		var router=new VueRouter({
			routes:[
				{
					path:'/index',
					component:index,
					children:[
						{
							path:'/miao',
							component:miao
						}
					]
				},
				{
					path:'/list',
					component:list
				},
				{
					path:'/my',
					component:my
				}
			]
		})
		

⑤script中挂载相关的路由

		//挂载路由	
		new Vue({
			el:'#app',
			router:router
		})

⑥如果要设置嵌套的路由，务必在相关嵌套的路由内部设置children写挂载哦。

					children:[
						{
							path:'/miao',
							component:miao
						}
					]