這次遇到的一個問題困擾了我很久很久，大致就是vue路由的addRoutes方法的使用，每次在調用了這個之后router對象中并沒有將路由添加進去，接下來，我一步一步的分析原因及解決方法（個人見解，僅供參考）

（1）先看看我的失敗的代碼

?

store.getters.addRouters我存在vuex中，但是實際是存于session中的，所以刷新后是不會丟失數據的

?

在app.vue的mounted輸出this.$router對象，發現options.routes數組并沒有將動態路由添加成功，這個問題困擾了很久，最后找到原因是執行了window.location.reload();使得頁面重新加載了，解決辦法是：在beforeEach里判斷當前路由是否已經有動態路由了，如果沒有則添加，并且拉取用戶信息的處理不放在登錄成功之后，這樣就不會受reload的影響

（2）第二版代碼

?

?

這樣改了之后，理論上應該可以了，輸出this.$router對象，發現options.routes數組還是沒有將動態路由添加成功，

在網上找了解決方案，手動將需要添加的路由添加到options.routes數組（由于路由的所有信息我是在vuex存了的，所以直接全部賦值給了options.routes）

?

做到這一步，已經完成大部分了，options.routes數組有數據了，動態添加的路由可以正常跳轉，頁面也有內容，但是很快我又發現一個問題，動態添加的路由頁面一刷新就涼涼了（空白），在地址欄輸入其他動態添加的路由又是可以正常跳轉的，這就很尷尬了。參考了https://github.com/PanJiaChen/vue-element-admin/blob/master/src/permission.js?，找到了解決方法

將next()換成next({ ...to, replace: true })，// hack方法 確保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record

進行到這一步，基本上就已經可以了，這個問題網上有很多類似，但是他們登錄跟我不一樣，也沒有window.location.reload();這一步，所以解決起來還是有不一樣的地方

轉載于:https://www.cnblogs.com/xyz47325/p/10796071.html

總結

以上是生活随笔為你收集整理的基于vue框架项目开发过程中遇到的问题总结（三）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。