知識點：路由巢狀

場景：
今天遇到一個需求是這樣的，有一個管理系統的列表頁，點選某一行進入那一行的詳情頁面，於是我想這樣設計路由。主要是在 App.vue 裡套一個 FeedBack ，元件裡面只有 <router-view>來進行路由巢狀，再給這個元件里加子元件就好啦。

效果：

程式碼：

// router.js
export default new Router({
  mode: 'history',
  base: '/pfizer-subapp/pc/admin',
  routes: [
    {
      path: '/feedback',
      component: Feedback,
      children: [
        {
          path: 
 
'/',
          redirect: '/feedback/main'
        },
        {
          path: '/feedback/main',
          name: 'FedMain',
          component: FedMain
        },
        {
          path: '/feedback/detail/:id',
          name: 'FedDetail',
          component: FedDetail
        }
      ]
    }
  ]
})

//
 
 App.vue
<template>
  <div>
    <div class="left">
      左邊側導航
    </div>
    <div class="right">
      <router-view />
    </div>
  </div>
</template>

// feedback.vue
<template>
  <div id="feedback">
    <router-view></router-view>
  </div>
</template>

// fed-main.vue
<template>
  <div id="fed-main">
    表格程式碼
  </div>
</template>

// fed-detail.vue
<template>
  <div id="fed-detail">
    詳情程式碼
  </div>
</template>

轉：https://blog.csdn.net/weixin_43972437/article/details/100810427