vue 的keep alive快取功能的實現

2022-10-06 21:39:21 字數 558 閱讀 7818

vue 實現元件資訊的快取

當我們在開發vue的專案過程中,避免不了在路由切換到其他的component再返回後該元件資料會重新載入,處理這種情況我們就需要用到keep-alive來快取vue的元件資訊,使其不再重新載入。

一、在app.vue裡

ve>

但是這種情況會對所有的元件進行快取,不能達到單個元件快取的效果。

那麼我們給部分元件加上,實現方法如下:

在app.vue

www.cppcns.comive">

www.cppcns.com>

二、 在路由的index.js頁面裡

// 這個是需要keepalive的

}, // 這是不會被keepalive的

}這就實現了部分元件的快取功能

如果快取的元件想要清空資料或者執行初始化方法,在載入元件的時候呼叫activated鉤子函式,如下:

activated: function ()

本文標題: vue 的keep-alive快取功能的實現

本文位址: /ruanjian/j**a/223580.html

vue快取機制 keep alive

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

vue 之 keep alive快取元件

當在這些元件之間切換的時候,你有時會想保持這些元件的狀態,以避免反覆重渲染導致的效能問題。keep alive 可緩緩存元件,保留之前的元件,不會重新渲染元件 元件到 archive 標籤,然後再切換回 posts,是不會繼續展示你之前選擇的文章的。這是因為你每次切換新標籤的時候,vue 都建立了乙...

vue使用keep alive快取元件

在這裡keep alive配合了router view使用,keep alive本身是vue2.0的功能,並不是vue router的,所以在vue1.0版本是不支援的。在vue路由中使用meta配合實現效果 在router檔案加上meta判斷 import vue from vue import ...