vue-router頁面跳轉

Vue-Router的教程位址https://router.vuejs.org/zh-cn/

我們在建立項目的時候指令行如下：

$ vue init webpack my-project
$ cd my-project
$ npm install
$ npm run dev           

最新的項目已經自動安裝了vue-router 下面介紹步驟

一、vue元件中添加标簽，格式如下

<div class="tab">
      <div class="tab-item">
        <router-link to="/goods">商品</router-link></div>
      <div class="tab-item">
        <router-link to="/rating">評論</router-link></div>
      <div class="tab-item">
        <router-link to="/seller">商家</router-link></div>
    </div>
    <router-view></router-view>           

二、router檔案夾下的index.js檔案

export default new Router({
  routes: [
    {
      path: '/goods',
      component: Goods
    },
    {
      path: '/rating',
      component: Ratings
    },
    {
      path: '/seller',
      component: Seller
    }
  ]
})           

其實作在建立的項目已經幫我們內建好了，我們隻需要配置上面兩部即可，直接去看文檔反而，有些雲裡霧裡。希望能給需要的人一些幫助。