vdom、instance、component、module

vdom

  • Document 類,整個頁面文檔。
  • Node 類,結點的基礎類。
  • Element 類,元素結點,繼承自 Node,單個視圖單元。
  • Comment 類,注釋結點,繼承自 Node,無實際意義,通常用作占位符。

每個 Weex 頁面都有一個 weex.document 對象,該對象就是一個 Document 類的實例,也是下面所有接口調用的起點。

Document

每個 Document 實例在創建的時候都會自動擁有一個 documentElement 屬性,表示文檔結點。該文檔結點可以擁有一個 body

文檔的主體結點只接受 <div><list><scroller> 三種類型的元素結點。

包含方法:createELementcreateComponentcreateBodyfireEventdestroy

body: Element

  • 文檔的主體結點,概念類似 HTML DOM 里的 document.body。

documentElement: Element

  • 文檔的對應結點,概念類似 HTML DOM 里的 document.documentElement。
    body 和 documentElement 的關系是:documentElement 是 body 的父結點。

getRef(id): Node

  • 根據結點 id 獲取結點。
Node

一個虛擬節點類。

ref

  • 每個 Node 實例都有各自的在整個 Document 實例中唯一的 ref 值。

children: Node[]

  • 該結點擁有的所有子結點的數組。

pureChildren: Node[]

  • 該結點擁有的所有子元素的數組。和 children 的區別是,pureChildren 只包含了 Element 實例而不包含 Comment 實例。
Element 類 繼承自 Node

包含對 Dom 樹的操作方法:appendChildinsertBeforeinsertAfterremoveChildclear

屬性操作setAttrsetStyleaddEventremoveEventfireEvent

WebElement 繼承自 Element

  • 插入一個 webView

toJSON(): Object

nodeType: number

  • 永遠是數字 1。
Comment 類 繼承自 Node

注釋節點

nodeType: number

  • 永遠是數字 8。

toJSON(): Object

nodeType
  • 1 普通 element,
  • 8 comment
  • 3 TextNode,Vue 中 定義的 TextNode,<element>TextNode<element>

instance

1、頁面示例

每一個頁面都有為一個 instance,由 instance 負責 加載 jsbundle,并且
js 和 native 通信 的第一個參數 都是 instanceID。

2、生命周期

createInstance,
refreshInstance,
destroyInstance

component

1、組件

2、生命周期

weex    vue Description
init    beforeCreate    組件實例剛剛被創建,組件屬性如data計算之前
created created 組件實例創建完成,屬性已綁定,但DOM還未生成
beforeMount 模板編譯/掛載之前
ready   mounted 模板編譯/掛載之后
beforeUpdate    組件更新之前
updated 組件更新之后
activated   forkeep-alive, 組件被激活時調用
deactivated forkeep-alive, 組件被移除時調用
beforeDestroy   組件被銷毀前調用
destroyed   destroyed   組件被銷毀后調用
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,002評論 6 542
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,400評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,136評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,714評論 1 317
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,452評論 6 412
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,818評論 1 328
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,812評論 3 446
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,997評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,552評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,292評論 3 358
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,510評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,035評論 5 363
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,721評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,121評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,429評論 1 294
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,235評論 3 398
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,480評論 2 379

推薦閱讀更多精彩內容