vue中有快取機制嗎

2022-10-10 08:18:16 字數 695 閱讀 7722

vue中有快取機制,可以利用「keep-alive」把切換出去的元件保留在記憶體中,保留該元件的狀態或避免重新渲染,實現頁面快取;「keep-alive」是乙個vue內建的抽象元件,用於快取元件,避免多次載入相同的元件,減少效能消耗。

快取,不管是pc 端還是移動端,不可避免的問題。vue中有乙個keepalive,這個api 基本 能實現我們開發的一些需要。

簡單介紹下keep-alive:

1、把切換出去的元件保留在記憶體中,可以保留它的狀態或避免重新渲染,實現頁面快取;

2、是抽象元件,它自身不會渲染dom元素,也不會出現在父元件鏈中。

3、當元件在內被切換,它的actived 和 deactived 這兩個生命週期鉤子函式將會被對應執行。(這個基本沒什麼)

注:在2.2.0及其更高版本中,activated 和 deactivated 將會在樹內的所有巢狀元件中觸發。

keep-alive是vue的內建元件,當它包裹動態元件時,會快取不活動的元件例項,而不是銷毀。

作用:用來快取元件,避免多次載入相同的元件,減少效能消耗,提高使用者體驗。

使用方式舉例:

在app.vue中使用keep-alive標籤,表示快取所有頁面

部分頁面快取

注意:其中transition 直接包在這兩個外面 會報錯;直接用transition-group也會報錯,需要用兩個transition。

vue快取機制 keep alive

到現在,接觸vue也小段時間了,專案進行到了一定程度,然而專案缺少了快取機制,所以每次跳轉頁面都會重新created一下資料,雖說系統的資料請求速度很快,但是這樣做對系統的效能會有很大的壞處的,所以到這裡就要對系統優化下,新增快取了。其實到現在,對於vue還是沒有玩通,每深挖一次,就會發現一次vue...

Vue框架的keep alive 快取機制

在 router 中將需要不重新整理的頁面 加上meta屬性 在index頁面中新增路由守衛beforerouteenter 中判斷當前頁面是否為要快取的頁面 beforerouteenter to,from,next next keep alive開始後,會多出 activated 和deacti...

oracle中有case語句嗎

oracle中有case語句 該語句可以把表示式結果同提供的幾個可預見的結果作比較,如果比較成功,則執行對應的語句序列,語法為 case 表示式 when 表示式結果1 then 執行項 when 表示式結果2 then 執行項 本教程操作環境 windows10系統 oracle 11g版 del...