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');