vue 刷新之后 嵌套路由不變 重新渲染頁面的方法

解決嵌套路由刷新時(shí)，路由沒有變化，正常情況下頁面是不會(huì)重新渲染的

1、在router-view中加上條件渲染 v-if 默認(rèn)為true。讓它顯示出來

2、寫寫一個(gè)reload方法，在頁面刷新只有，點(diǎn)擊某個(gè)查詢條件的時(shí)候調(diào)用這個(gè)重載的方法

這是條件渲染變化了為false

在修改數(shù)據(jù)之后使用 $nextTick，

條件渲染變化了為true

則可以在回調(diào)中獲取更新后的 DOM

如果需要帶有查詢參數(shù)，可以用編程試導(dǎo)航，query來傳參，但是這種方式可能刷新之后會(huì)有問題。

我的解決方法是在刷新之后點(diǎn)擊頁面中的某個(gè)條件的時(shí)候，將參數(shù)存在localstorage里面，這個(gè)時(shí)候執(zhí)行reload方法來重新加載路由。這樣無論路由變美變化頁面都會(huì)重新加載，再次加載數(shù)據(jù)。

這樣還會(huì)有一個(gè)問題，就在在頁面刷新的時(shí)候，查詢條件會(huì)重置，這樣存在localstorage里面的值也要清空。

解決方法就是監(jiān)聽瀏覽器的刷新事件

window.onbeforeunload = function(event) {
 sessionStorage.removeItem('querydataObj')
};

然后清除sessionstorage。

以上這篇vue 刷新之后 嵌套路由不變 重新渲染頁面的方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com