問題描述：
　　第一次進入頁面，左側靜態路由和動態路由列表均能正常顯示，但點選左側其他路由後瀏覽器報警告[vue-router] Duplicate named routes definition…,並且跳轉失敗。

　　動態路由的概念：
　　一般來說是通過後端介面返回拿到資料，不同人不同許可權，返回的資料也不同。然後在路由守衛router.beforeEach 中進行新增路由。

解決方案：
　　建立本地儲存一個欄位，第一次來的時候正常增加addRoutes，增加後立刻改變本地儲存狀態，並且增加判斷，所以再次進入其他路由時就不會觸發addRoutes了

　　解決程式碼：
　　在permission.js檔案中：

window.sessionStorage.setItem('Aside', '0')
router.beforeEach((to, from, next) => {
  if (window.sessionStorage.getItem('Aside') === '0') {
    store.dispatch('GenerateRoutes').then(accessRoutes => {
      // 根據roles許可權生成可訪問的路由表
      window.sessionStorage.setItem('Aside', '1')
      router.addRoutes(accessRoutes) 
 
// 動態新增可訪問路由表
      next({ replace: true }) // hack方法 確保addRoutes已完成
    })
  }
   next()
})

————————————————
版權宣告：本文為CSDN博主「百事可口」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處連結及本宣告。
原文連結：https://blog.csdn.net/qq_38594056/article/details/121541879