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

2021-10-11 08:15:32 字數 600 閱讀 2899

前言

最近設計動態路由時,重新整理頁面空白。突然想起以前筆記裡面記錄過,翻看了下,今天得空兒分享出來。

問題描述

在全域性前置守衛router.beforeeach裡面加入動態路由設計時,重新整理動態頁面,明明router已經生成了,結果還是空白,列印後發現to物件裡面除了path其餘屬性皆為空值(如下圖)。

原因在重新整理後動態路由需要重新獲取,而to物件是在動態路由生成之前產生,所以獲取不到真正路由資訊。

解決方案

方案一正常的next()加個matched長度判斷,matched是當前路由的所有巢狀路徑片段的路由記錄。

...省略正常判斷路由是否存在...

if(to.matched.length ===0)

next()

else

next

()

方案二

if

(!token));

}else

}else

路由不變的情況下,重新整理頁面

在vue寫的後台管理專案中,經常會有增 刪 改 查的操作,這些操作只是跟用介面跟後台互動下 既然用接 互,那肯定就是axios的非同步請求,那麼就是說後台資料發生了改變,但是前台的資料並沒有實時的更新 每次操作完後台把列表資料重新返給你例外,但是這樣的話每次互動的資料量就偏大了 所以就要想乙個辦法,...

react路由引數改變,重新整理頁面

需求 當頁面url從 test?id 01 變成 test?id 02 時,介面需要根據引數獲取最新資料並且渲染頁面。解決方案 方式一 react16之前推薦使用componentwillreceiveprops生命週期 import react,from react import router f...

在不重新整理頁面的情況下,更新頁面

先註冊乙個名為redirect的路由 export default this route const params this router.replace render function h script 手動重定向頁面到 redirect頁面 const this route this route...