關于Vue實現(xiàn)組件信息的緩存問題
更新時間：2017年08月23日 09:37:53 作者：hsany330
這篇文章主要介紹了關于Vue實現(xiàn)組件信息的緩存問題的相關資料,需要的朋友可以參考下
當我們在開發(fā)vue的項目過程中，避免不了在路由切換到其他component再返回后該組件數(shù)據(jù)會重新加載，處理這種情況我們就需要用到keep-alive來緩存vue的組件信息，使其不再重新加載。
在app.vue里
<keep-alive> <router-view></router-view> </keep-alive>
但是這種情況會對所有的組件進行緩存，不能達到單個組件緩存的效果。
那么我們給部分組件加上，實現(xiàn)方法如下：
在app.vue里
<!-- 這里是需要keepalive的 --> <keep-alive> <router-view v-if="$route.meta.keepAlive"></router-view> </keep-alive> <!-- 這里不會被keepalive --> <router-view v-if="!$route.meta.keepAlive"></router-view>
然后在設置路由信息的時候這樣
{
path: '',
name: '',
component: ,
meta: {keepAlive: true} // 這個是需要keepalive的
},
{
path: '',
name: '',
component: ,
meta: {keepAlive: false} // 這是不會被keepalive的
}
這就實現(xiàn)部分組件緩存的功能
如果緩存的組件想要清空數(shù)據(jù)或者執(zhí)行初始化方法，在加載組件的時候調(diào)用activated鉤子函數(shù)，如下：
activated: function () {
this.data = '';
}
總結(jié)
以上所述是小編給大家介紹的關于Vue實現(xiàn)組件信息的緩存問題，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關文章
編程式路由在我們的項目使用過程中最常用的的方法了。這篇文章主要介紹了講解vue-router之什么是編程式路由，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
vue中el-select中多選回顯數(shù)據(jù)后沒法重新選擇和更改的解決
本文主要介紹了vue中el-select中多選回顯數(shù)據(jù)后沒法重新選擇和更改解決,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2024-01-01
這篇文章主要介紹了Vue樣式綁定的幾種實現(xiàn)方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
本文主要介紹了el-tree文字顯示不全的解決辦法，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
vue項目中的數(shù)據(jù)變化被watch監(jiān)聽并處理
這篇文章主要介紹了vue項目中的數(shù)據(jù)變化被watch監(jiān)聽并處理，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
vue通過滾動行為實現(xiàn)從列表到詳情,返回列表原位置的方法
今天小編就為大家分享一篇vue通過滾動行為實現(xiàn)從列表到詳情,返回列表原位置的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了使用vxe-table合并單元格后增加選中效果，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
vue3?element?plus按需引入最優(yōu)雅的用法實例
這篇文章主要給大家介紹了關于vue3?element?plus按需引入最優(yōu)雅的用法,以及關于Element-plus按需引入的一些坑,文中通過圖文介紹的非常詳細,需要的朋友可以參考下2022-03-03
這篇文章主要為大家詳細介紹了Vue3編寫氣泡對話框組件，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-08-08
解決npm安裝錯誤:No matching version found for&
這篇文章主要介紹了解決npm安裝錯誤:No matching version found for XXX@3.3.6問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-07-07