用eventbus 事件匯流排來控制項是否需要快取:
//引入了外掛程式,注意全域性只能使用同乙個emitter
import mitt from 'mitt'
export const emitter = mitt()
預設所有頁面都進行快取,用:exclude="alivecomponent" ,排除不需要快取的元件,可以實現動態更改元件是否快取
alivecomponent: "newqueue,releaseset" //不需要快取的元件頁面名
// 新增不快取元件
function setnotalivecomponent(keyword: string)
datas.alivecomponent = aliveitems;
}// 移除不快取元件
function removenotalivecomponent(keyword: string)
});aliveitems = arr.join(",");
datas.alivecomponent = aliveitems;
}//接收 新增 不快取元件 事件
emitter.on("add-no-alive-compt", (e) => );
//接收 移除 不快取元件 事件
emitter.on("remove-no-alive-compt", (e) => );
然後,在需要快取的頁面中觸發事件
// 在不需要元件快取時,比如在後退按鈕中 新增 【不需要快取元件】
emitter.emit("add-no-alive-compt", "queue");
// 在需要元件快取時,比如在前進頁面前 移除 【不需要快取元件】
emitter.emit("remove-no-alive-compt", "queue");
這裡主要是混合開發中的h5,如果後退使用到瀏覽器自帶的後退功能,要結合路由來判斷當前頁面是否後退來進行觸發新增 是否快取事件了。 vue3新增Suspense元件
在開始介紹vue的suspense元件之前,我們有必要先了解一下react的suspense元件,因為他們的功能類似。react 16.6 新增了元件,讓你可以 等待 目標 載入,並且可以直接指定乙個載入的介面 像是個 spinner 讓它在使用者等待的時候顯示 const profilepage ...
Vue 3 元件註冊
上一節實驗中,我們大概了解了一下元件的基礎,這一節實驗我們要深入元件註冊。我們在註冊元件的時候,我們都會給元件起乙個名字,就好像我們人的名字一樣。需要注意的是,我們的元件名字是有一些規範的,一般這種單檔案元件,我們強烈推薦使用字母全小寫且必須包含乙個連字元,全部小寫字母,單詞使用中華線 隔開。例如我...
vue3 元件通訊 vue router
關於元件通訊 1.父子元件間傳值 props emit parent children ref 2.非父子元件傳值 事件匯流排 原理就是建立乙個公共的js檔案,專門用來傳遞資訊 import vue from vue export default new vue 在需要傳遞訊息的地方引入 impor...