vue 路由跳轉地址欄參數改變了，對應組件內容沒了

兄弟問題鏈接：https://segmentfault.com/q/10...
默認展示 首頁 文字

點擊分類 組件內容不顯示
http://localhost:8080/Fen

app.vue

<template>
  <div id="app">
    <Header></Header>

    <div class="main">
      <keep-alive>
          <router-view></router-view>
      </keep-alive>
    </div>
    
    <Footer></Footer>
  </div>
</template>

router/index.js

import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/components/Home'
import Fen from '@/components/Fen'
import Cart from '@/components/Cart'
import Center from '@/components/Center'
Vue.use(Router)

export default new Router({
  mode: 'history',
  watch: {  
  '$route' (to, from) {  
    // data數據操作  
  }  
} ,
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/',
      name: 'Fen',
      component: Fen
    },
    {
      path: '/',
      name: 'Cart',
      component: Cart
    },
    {
      path: '/',
      name: 'Center',
      component: Center
    }
  ]
})