props 的使用
包裹動態元件時,會快取不活動的元件例項,而不是銷毀它們
當元件在 內被切換,它的
activated
和deactivated
這兩個生命週期鉤子函式將會被對應執行
主要用於保留元件狀態或避免重新渲染。
結合router-view使用"test-keep-alive"
>
//將快取name為test-keep-alive的元件
<
/component>
<
/keep-alive>
"a,b"
>
//將快取name為a或者b的元件,結合動態元件使用
"view"
>
<
/component>
<
/keep-alive>
"/a|b/"
>
//使用正規表示式,需使用v-bind
"view"
>
<
/component>
<
/keep-alive>
"includedcomponents"
>
<
/router-view>
<
/keep-alive>
"test-keep-alive"
>
<
!-- 將不快取name為test-keep-alive的元件 --
>
<
/component>
<
/keep-alive>
"$route.meta.keepalive"
>
<
/router-view>
<
/keep-alive>
"!$route.meta.keepalive"
>
<
/router-view>
export
default
newrouter(}
,}]}
)
activated
: 頁面第一次進入的時候,鉤子觸發的順序是created->mounted->activated->deactivated
頁面退出的時候會觸發
deactivated
,當再次前進或者後退的時候只觸發activated
keep alive生命週期
生命週期執行順序 1 不使用keep alive的情況 beforerouteenter created mounted destroyed 2 使用keep alive的情況 beforerouteenter created mounted activated deactivated 3 使用ke...
Fragment及Activity生命週期對比
主要看兩張圖,和跑 一,fragment的生命周 oncreateview是建立的時候呼叫,onviewcreated是在oncreateview後被觸發的事件,前後關係 就是fragment中的oncreateview和onviewcreated的區別和聯絡。且onstart執行時間位於onvie...
keep alive的使用及詳解
keep alive 是 vue 的內建元件,當它包裹動態元件時,會快取不活動的元件例項,而不是銷毀它們。和 transition 相似,keep alive 是乙個抽象元件 它自身不會渲染成乙個 dom 元素,也不會出現在父元件鏈中。在元件切換過程中將狀態保留在記憶體中,防止重複渲染dom,減少載...