vue-router的使用

Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。
优点如下：

• 嵌套的路由/视图表
• 模块化的、基于组件的路由配置
• 路由参数、查询、通配符
• 基于 Vue.js 过渡系统的视图过渡效果
• 细粒度的导航控制
• 带有自动激活的 CSS class 的链接
• HTML5 历史模式或 hash 模式，在 IE9 中自动降级
• 自定义的滚动条行为

下面来个例子：

	<!--1.引入vue的模块--><script type="text/javascript" src="vue.js"></script><!-- 2.引入vue-router模块--><script type="text/javascript" src="vue-router-dev/dist/vue-router.js"></script>//4.创建router对象var router = new VueRouter({
//            5. 配置路由对象routes:[{path:'/login',component:Login},{path:'/register',component:Register}]});//引入vue-router模块之后 抛出来两个全局组件 router-link：a to：href
//          router-view：路由匹配组件的出口var App = {template:'<div>' +'<router-link to="/login">登录界面</router-link>'+'<router-link to="/register">注册界面</router-link>' +'<router-view></router-view>' +'</div>'};new Vue({el:"#app",components:{App:App},//6.交给实例化对象管理router,template:'' +'<div><App/></div>'});

渲染效果如下：

点击后，相应的DOM被渲染出来。

SPA 单页面应用 Single Page Application