動態路由頁面重新整理空白了

2022-06-29 19:51:10 字數 757 閱讀 5917

問題描述:

剛開始的時候我的基本思路是在登入後呼叫後台獲取選單列表的介面然後新增到路由裡面去,同時把選單資料存到store裡面,在進入首頁之後從store裡取出來生成左側選單列表。然而,當我把**寫完之後,發現當頁面重新整理時候,頁面就空白了,蛋疼

查詢資料分析原因:

這個的根本原因是沒有做路由的持久化,而且頁面重新整理之後store裡面的資料也清空了。為了解決上述問題,我就在登入後獲取到的選單資料列表存在localstorage裡

實現思路:

先寫個預設配置路由

const router = new router(,

,]

})

在動態新增路由的過程中,如果有 404 頁面,一定要放在最後新增,否則在登陸的時候新增完頁面會重定向到 404 頁面。吃了很大的虧,看來對路由還是不熟,要加深印象

接收後端返回的路由資訊,當然不要指望後端按照你的路由表完全對比著發過來,考慮到路由效能,component非同步載入的方式後端是給不出來的,(後台小哥哥不開面啊,沒辦法,自己搞,他這麼跟我說的)

基本思路:在這之前,前端要把所有的頁面路由寫好,在router.beforeeach做判斷,如果快取裡面有路由資訊,就從快取裡拿,如果快取沒有,發請求獲取路由表並localstorage儲存起來並交由vuex管理(我處理後端給的路由業務邏輯在vuex裡寫的)。然後通過addroutes方法合併之前的路由,千萬不要忘了404頁面要最後push,最後退出的時候清楚快取,至此,抽根菸,解心寬

動態路由下重新整理 頁面空白

前言 最近設計動態路由時,重新整理頁面空白。突然想起以前筆記裡面記錄過,翻看了下,今天得空兒分享出來。問題描述 在全域性前置守衛router.beforeeach裡面加入動態路由設計時,重新整理動態頁面,明明router已經生成了,結果還是空白,列印後發現to物件裡面除了path其餘屬性皆為空值 如...

vue動態路由來生成系統選單 解決重新整理空白的問題

由於子路由都是動態追加的,當介面重新整理的時候,其實我們路由裡面並沒有該子介面的配置,所以就是空白了 在頁面重新整理時候,在router.beforeeach裡面去判斷,如果是動態路由而且是第一次載入,則動態追加該路由,再進行介面的跳轉。我的思路 在頁面重新整理或是第一次載入進來時,建立乙個變數,然...

vue路由巢狀無法渲染 頁面空白

router index.js import vue from vue import router from vue router import helloworld from components helloworld import login from components layout log...