SOURCE

console 命令行工具 X clear

                    
>
console
Vue.use(VueRouter);
var router = new VueRouter({
  routes: [
    {
      path: '/page1',
      component: {
        template: '<p>{{ title }}</p>',
        data: function(){
          return {
            title: 'this is page1'
          }
        }
      }
    },
    {
      path: '/page2',
      component: {
        template: '<p>{{ title }}</p>',
        data: function(){
          return {
            title: 'this is page2'
          }
        }
      }
    },
    {
      path: '/page3',
      component: {
        template: '<p>{{ title }}</p>',
        data: function(){
          return {
            title: 'this is page3'
          }
        }
      }
    }
  ]
});
var app = new Vue({
  el: '#app',
  router,
  data: {
    msg: 'Hello VUE!'
  }
});
<script src="http://cdn.bootcss.com/vue/2.2.6/vue.js"></script>
<script src="http://cdn.bootcss.com/vue-router/2.3.1/vue-router.js"></script>

<div id="app">
  <h1>{{ msg }}</h1>
  <ul>
    <li><router-link to="/page1">page1</router-link></li>
    <li><router-link to="/page2">page2</router-link></li>
    <li><router-link to="/page3">page3</router-link></li>
  </ul>
  <router-view></router-view>
</div>