vue keep-alive的簡單總結(jié)
一、作用
主要用于保留組件狀態(tài)或避免重新渲染。
二、用法
<keep-alive> 包裹動態(tài)組件時，會緩存不活動的組件實(shí)例，而不是銷毀它們。
<keep-alive> 是一個抽象組件：它自身不會渲染一個 DOM 元素，也不會出現(xiàn)在組件的父組件鏈中。
當(dāng)組件在 <keep-alive> 內(nèi)被切換，它的 activated 和 deactivated 這兩個生命周期鉤子函數(shù)將會被對應(yīng)執(zhí)行。
三、Props
include
include - 字符串或正則表達(dá)式。只有名稱匹配的組件會被緩存。
exclude
exclude - 字符串或正則表達(dá)式。任何名稱匹配的組件都不會被緩存。
include 和 exclude prop 允許組件有條件地緩存。二者都可以用逗號分隔字符串、正則表達(dá)式或一個數(shù)組來表示：
<!-- 逗號分隔字符串 --> <keep-alive include="a,b"> <component :is="view"></component> </keep-alive> <!-- 正則表達(dá)式 (使用 `v-bind`) --> <keep-alive :include="/a|b/"> <component :is="view"></component> </keep-alive> <!-- 數(shù)組 (使用 `v-bind`) --> <keep-alive :include="['a', 'b']"> <component :is="view"></component> </keep-alive>
匹配首先檢查組件自身的 name 選項(xiàng)，如果 name 選項(xiàng)不可用，則匹配它的局部注冊名稱 (父組件 components 選項(xiàng)的鍵值)。匿名組件不能被匹配。
max
max - 數(shù)字。最多可以緩存多少組件實(shí)例。
一旦這個數(shù)字達(dá)到了，在新實(shí)例被創(chuàng)建之前，已緩存組件中最久沒有被訪問的實(shí)例會被銷毀掉。
<keep-alive :max="10"> <component :is="view"></component> </keep-alive>
以上就是淺析vue中的keep-alive的詳細(xì)內(nèi)容，更多關(guān)于vue中的keep-alive的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要介紹了vue中js判斷長時間不操作界面自動退出登錄,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友可以參考下2020-01-01
vue項(xiàng)目頁面嵌入代碼塊vue-prism-editor的實(shí)現(xiàn)
這篇文章主要介紹了vue項(xiàng)目頁面嵌入代碼塊vue-prism-editor的實(shí)現(xiàn),本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-10-10
Vue腳手架學(xué)習(xí)之項(xiàng)目創(chuàng)建方式
這篇文章主要給大家介紹了關(guān)于Vue腳手架學(xué)習(xí)之項(xiàng)目創(chuàng)建方式的相關(guān)資料，文中通過介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
vue 路由傳參的使用場景一般都是應(yīng)用在父路由跳轉(zhuǎn)到子路由時,攜帶參數(shù)跳轉(zhuǎn),傳參方式可劃分為 params 傳參和 query 傳參,本文將給大家介紹如何通過不同方式在 Vue 3 中傳遞路由參數(shù),需要的朋友可以參考下2024-07-07
這篇文章主要介紹了解決Vue @submit 提交后不刷新頁面問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
本文通過實(shí)例代碼給大家介紹了vue仿百度搜索功能，非常不錯，具有參考借鑒價值，需要的的朋友參考下吧2017-02-02
本篇文章主要介紹了了解VUE的render函數(shù)的使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
在Vue中,我們可以使用unplugin-generate-component-name插件自動基于目錄名稱生成組件名稱,這個插件使得在大型代碼庫中找到和管理組件更加容易和直觀,這篇文章主要介紹了Vue自動生成組件示例總結(jié),需要的朋友可以參考下2023-12-12
vue3+vite實(shí)現(xiàn)在線預(yù)覽pdf功能
這篇文章主要為大家詳細(xì)介紹了如何通過vue3和vite實(shí)現(xiàn)在線預(yù)覽pdf功能,文中的示例代碼簡潔易懂,具有一定的借鑒價值,感興趣的小伙伴可以學(xué)習(xí)一下2023-10-10
vue中重定向redirect:‘/index‘,不顯示問題、跳轉(zhuǎn)出錯的完美解決
這篇文章主要介紹了vue中重定向redirect:‘/index‘,不顯示問題、跳轉(zhuǎn)出錯的完美解決方案，本文通過圖文并茂的形式給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友參考下吧2020-09-09