vue快取機制 keep alive

2021-08-22 02:36:20 字數 708 閱讀 8795

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

其實到現在,對於vue還是沒有玩通,每深挖一次,就會發現一次vue的精彩,開始不清楚要用什麼實現快取,找了好久,有好幾種說法,就是用vuex、vuet或者keep-alive,然後對比了一下,在我認為,vuex和vuet是實現狀態管理,重心是在資料處理上;想要實現整體的快取,阻止created的重新整理,就要用keep-alive。

所以這裡我想要給大家介紹下如何用keep-alive實現快取的頁面?其實很簡單,就是幾句話而已。

3、在router檔案加上meta判斷

import vue from 'vue'

import router from 'vue-router'

vue.use(router)

export default new router(}}

})

想要看有沒有快取成功,可以在各個元件的created鉤子裡面列印輸出標誌,快取成功就是首次進入頁面,created會請求資料,後面就不會再次請求而是直接呼叫快取的

新增了快取可以大大減少對系統效能的損壞,畢竟做資料處理型的系統,資料過於龐大,每次都要請求一下頁面是很不好的,有了快取,該快取的快取,不想快取也可以實時重新整理

vue中有快取機制嗎

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

Vue框架的keep alive 快取機制

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

IOS 開發快取機制 記憶體快取機制

使用快取的目的是為了使用的應用程式能更快速的響應使用者輸入,是程式高效的執行。有時候我們需要將遠端 web伺服器獲取的資料快取起來,減少對同乙個 url多次請求。記憶體快取我們可以使用 sdk中的 nsurlcache類。nsurlrequest需要乙個快取引數來說明它請求的 url何如快取資料的,...