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

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

?

store.getters.addRouters我存在vuex中，但是實(shí)際是存于session中的，所以刷新后是不會(huì)丟失數(shù)據(jù)的

?

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

（2）第二版代碼

?

?

這樣改了之后，理論上應(yīng)該可以了，輸出this.$router對(duì)象，發(fā)現(xiàn)options.routes數(shù)組還是沒有將動(dòng)態(tài)路由添加成功，

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

?

做到這一步，已經(jīng)完成大部分了，options.routes數(shù)組有數(shù)據(jù)了，動(dòng)態(tài)添加的路由可以正常跳轉(zhuǎn)，頁面也有內(nèi)容，但是很快我又發(fā)現(xiàn)一個(gè)問題，動(dòng)態(tài)添加的路由頁面一刷新就涼涼了（空白），在地址欄輸入其他動(dòng)態(tài)添加的路由又是可以正常跳轉(zhuǎn)的，這就很尷尬了。參考了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

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

轉(zhuǎn)載于:https://www.cnblogs.com/xyz47325/p/10796071.html

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。