Vue(十)---路由

　　Vue.js 路由允许我们通过不同的 URL 访问不同的内容。通过 Vue.js 可以实现多视图的单页Web应用（single page web application，SPA）。

需要引入vue-router.js

<div id="app">
    <div class="menu">
        
        <router-link to="/user">用户管理router-link>
        <router-link to="/product">产品管理router-link>
        <router-link to="/order">订单管理router-link>
    div>
     
    <div class="workingRoom">
        
         <router-view>router-view>   
    div>
 
div>
<script>
    /*
    * 申明三个模板( html 片段 )
    */
    var user = { template: '
用户管理页面的内容' };
    var second = { template: '
产品管理页面的内容' };
    var order = { template: '
订单管理页面的内容' };
    /*
    * 定义路由
    */
    var routes = [
        { path: '/', redirect: '/user'}, // 这个表示会默认渲染 /user，没有这个就是空白
        { path: '/user', component: user },
        { path: '/product', component: second },
        { path: '/order', component: order }
    ];
    /*
    * 创建VueRouter实例
    */
    var router = new VueRouter({
        routes:routes
    });
    /*
    * 给vue对象绑定路由
    */
    new Vue({
        el:"#app",
        router
    })
 
script>