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

2021-09-16 18:39:22 字數 717 閱讀 1122

背景1:在vue寫的後台管理專案中,經常會有增、刪、改、查的操作,這些操作只是跟用介面跟後台互動下

既然用接**互,那肯定就是axios的非同步請求,那麼就是說後台資料發生了改變,但是前台的資料並沒有實時的更新(每次操作完後台把列表資料重新返給你例外,但是這樣的話每次互動的資料量就偏大了)

背景2:在使用動態路由配置 /detail/:id 這樣的情況下,由於 router-view 是復用的,單純的改變 id 的值並不會重新整理 router-view

所以就要想乙個辦法,讓後台執行完操作後,給前台返乙個操作結果,然後前台手動重新整理頁面

一開始我想到的是用 window.location.reload() 或者this.$router.go(0) 這兩個方法,但是後來發現這兩個方法會有短暫的白屏時間,使用者體驗並不太好,所以就放棄了,看了下別人的做法,整理下面兩種方法:

這種方式意思就是讓每次操作完成以後,都讓路由跳轉到這個中轉站頁面,然後這個頁面獲取到進來路由的路徑再返回去就可以了,這種方式可以作為解決方法之一,普遍用的還是第二種。

子頁面

export default 

}methods:

}}

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

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

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

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

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

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