組件生命周期
組件的生命周期,指的是組件自身的一些函數,這些函數在特殊的時間點或遇到一些特殊的框架事件時被自動觸發。最重要的生命周期是 created
attached
detached
,包含一個組件實例生命流程的最主要時間點。
- 組件實例剛剛被創建好時,
created
生命周期被觸發。此時,組件數據this.data
就是在Component
構造器中定義的數據data
。 此時還不能調用setData
。 通常情況下,這個生命周期只應該用於給組件this
添加一些自定義屬性字段。 - 在組件完全初始化完畢、進入頁面節點樹后,
attached
生命周期被觸發。此時,this.data
已被初始化為組件的當前值。這個生命周期很有用,絕大多數初始化工作可以在這個時機進行。 - 在組件離開頁面節點樹后,
detached
生命周期被觸發。退出一個頁面時,如果組件還在頁面節點樹中,則detached
會被觸發。
Component({ lifetimes: { attached: function() { // 在組件實例進入頁面節點樹時執行 }, detached: function() { // 在組件實例被從頁面節點樹移除時執行 }, }, // 以下是舊式的定義方式,可以保持對 <2.2.3 版本基礎庫的兼容 attached: function() { // 在組件實例進入頁面節點樹時執行 }, detached: function() { // 在組件實例被從頁面節點樹移除時執行 }, // ... })
組件所在頁面的生命周期
還有一些特殊的生命周期,它們並非與組件有很強的關聯,但有時組件需要獲知,以便組件內部處理。這樣的生命周期稱為“組件所在頁面的生命周期”,在 pageLifetimes
定義段中定義。其中可用的生命周期包括:
Component({ pageLifetimes: { show: function() { // 頁面被展示 }, hide: function() { // 頁面被隱藏 }, resize: function(size) { // 頁面尺寸變化 } } })