Vue開發收集(keep alive)

2021-09-11 23:40:56 字數 844 閱讀 6479

在使用vue做開發的時候,我們有時會遇到需要保留元件狀態的情況,防止頁面重新繪製,這時候就需要使用keep-alive元件,該元件屬於vue的內建元件,同transition一樣,他本身不會渲染。 

當元件在內被切換,它的activateddeactivated這兩個生命週期鉤子函式將會被對應執行,也就是說使用了keep-alive後元件被啟用(被切換到的時候)會遇到鉤子函式activated,當被切換掉時候會執行deactivated鉤子函式。

在官網上有這樣的乙個例子:

上邊的例子在使用了後,在切換tab後cat ipsum也不會重新渲染,他會被儲存到記憶體中,下次切換回來直接讀取。

使用v-router的meta屬性可以做到,如下的**:

"$route.meta.live"/>

"!$route.meta.live"/>

export defualt new router(},}

]})複製**

這樣處理後的頁面跳轉會根據meta.live這個屬性判斷是否快取

有兩個重要的屬性 :

1.include: - 字串或正規表示式。只有匹配的元件會被快取

//字串

"a,b">

"view">

//正則,必須使用v-bind:include

"/a|b/">

"view">

複製**

2.

exinclude

: - 字串或正規表示式。排除不會快取的元件

Vue開發收集(開發中的技巧)

在大多數的情況下,我們不要直接訪問或是操作元件的dom,但是有時確實需要這樣做 在每個vue例項的子元件中可以使用體會 root訪問到vue的根例項 例項化根元件 new vue 子元件 export default 複製 這樣就直接訪問到了根上的資料,這種我們可以在根上儲存一些資料,然後後邊使用,...

Sybian開發收集

nokia官方培訓 symbian4300 筆記 二 symbianosbasics symbian是乙個software licensing公司,由nokia,sonyericsson index.html 索愛,松下,西門子,三星等公司控股,其中nokia股份最高,佔到近50 symbian本身...

Sublime Text 外掛程式 全棧開發收集

sublime text 具有漂亮的使用者介面和強大的功能,例如 縮圖,多重選擇,快捷命令等。sublime text 更妙的是它的可擴充套件性。所以,這裡挑選了 全棧開發必備的10款sublime text外掛程式 讓本已精彩的編輯器更加好用 全端開發的碼農們不用去網上乙個個找了,趕緊收藏起來吧 ...