Vue-router2.0版本的使用步驟

1.定義組件(2.0版本使用router-link做爲路由標籤，被渲染成)

import VueRouter from 'vue-router';
    Vue.use(VueRouter);
   ------------------------------------------------------

<template>
      <div id="app">
          <v-header :seller="seller"></v-header>
          <div class="tab border-1px">
            <div class="tab-item"><router-link :to="{path:'/goods'}">商品</router-link></div>
            <div class="tab-item"><router-link :to="{path:'/ratings'}">評論</router-link></div>
        <div class="tab-item"><router-link :to="{path:'/seller'}">商家</router-link></div>
      </div>
      <router-view></router-view>
  </div>
</template>

2.定義路由

const routes = [
  { path: '/goods', component: goods },
  { path: '/ratings', component: ratings },
  { path: '/seller', component: seller }
];

3.建立路由實例

const router = new VueRouter({
      linkActiveClass: 'active',
      routes // （縮寫）至關於 routes: routes
    });

4.建立根實例，渲染，掛載

new Vue({
router,
 render: h => h(App)
}).$mount('#myapp');