成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

snabbdom源碼解析（五） 鉤子

Worktile / 1134人閱讀

摘要：元素從父節(jié)點(diǎn)刪除時觸發(fā)，和略有不同，只影響到被移除節(jié)點(diǎn)中最頂層的節(jié)點(diǎn)在方法的最后調(diào)用，也就是完成后觸發(fā)源碼解析系列源碼解析一準(zhǔn)備工作源碼解析二函數(shù)源碼解析三對象源碼解析四方法源碼解析五鉤子源碼解析六模塊源碼解析七事件處理個人博客地址

文件路徑 ： ./src/hooks.ts

這個文件主要是定義了 Virtual Dom 在實(shí)現(xiàn)過程中，在其執(zhí)行過程中的一系列鉤子。方便外部做一些處理

// 鉤子
export interface Hooks {
    // 在 `patch` 開始執(zhí)行的時候調(diào)用
    pre?: PreHook;

    // 在 `createElm`，進(jìn)入的時候調(diào)用init
    // vnode轉(zhuǎn)換為真實(shí)DOM節(jié)點(diǎn)時觸發(fā)
    init?: InitHook;

    // 創(chuàng)建真實(shí)DOM的時候，調(diào)用 create
    create?: CreateHook;

    // 在`patch`方法接近完成的時候，才收集所有的插入節(jié)點(diǎn)，遍歷調(diào)用響應(yīng)的鉤子
    // 可以認(rèn)為插入到DOM樹時觸發(fā)
    insert?: InsertHook;

    // 在兩個節(jié)點(diǎn)開始對比前調(diào)用
    prepatch?: PrePatchHook;

    // 更新過程中，調(diào)用update
    update?: UpdateHook;

    // 兩個節(jié)點(diǎn)對比完成時候調(diào)用
    postpatch?: PostPatchHook;

    // 刪除節(jié)點(diǎn)的時候調(diào)用，包括子節(jié)點(diǎn)的destroy也會被觸發(fā)
    destroy?: DestroyHook;

    // 刪除當(dāng)前節(jié)點(diǎn)的時候調(diào)用。元素從父節(jié)點(diǎn)刪除時觸發(fā)，和destory略有不同，remove只影響到被移除節(jié)點(diǎn)中最頂層的節(jié)點(diǎn)
    remove?: RemoveHook;

    // 在`patch`方法的最后調(diào)用，也就是patch完成后觸發(fā)
    post?: PostHook;
}
snabbdom源碼解析系列

snabbdom源碼解析（一） 準(zhǔn)備工作

snabbdom源碼解析（二） h函數(shù)

snabbdom源碼解析（三） vnode對象

snabbdom源碼解析（四） patch 方法

snabbdom源碼解析（五） 鉤子

snabbdom源碼解析（六） 模塊

snabbdom源碼解析（七） 事件處理

個人博客地址

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/100420.html

相關(guān)文章

  • snabbdom源碼解析（六） 模塊

    摘要：模塊在里面，定義了一系列的模塊，這些模塊定義了相應(yīng)的鉤子。主要接受兩個參數(shù)，。傳送門事件模塊待續(xù)。。。源碼解析系列源碼解析一準(zhǔn)備工作源碼解析二函數(shù)源碼解析三對象源碼解析四方法源碼解析五鉤子源碼解析六模塊源碼解析七事件處理個人博客地址 模塊 在 ./src/modules 里面，定義了一系列的模塊 ， 這些模塊定義了相應(yīng)的鉤子 。這些鉤子會在 patch 的不同階段觸發(fā)，以完成相應(yīng)模塊的...

    zone 評論0 收藏0

  • snabbdom源碼解析（四） patch 方法

    摘要：就近復(fù)用為了盡可能不發(fā)生的移動，會就近復(fù)用相同的節(jié)點(diǎn)，復(fù)用的依據(jù)是判斷是否是同類型的元素方法在中，主要是方法。例如元素的之類的詳細(xì)了解請查看模塊模塊判斷是否是相同的虛擬節(jié)點(diǎn)判斷是否是相同的虛擬節(jié)點(diǎn)方法最后返回一個方法。 patch 方法 前言 在開始解析這塊源碼的時候，先給大家補(bǔ)一個知識點(diǎn)。關(guān)于 兩顆 Virtual Dom 樹對比的策略 diff 策略 同級對比showImg(ht...

    huhud 評論0 收藏0

  • snabbdom源碼解析（一） 準(zhǔn)備工作

    摘要：閱讀源碼的時候，想了解虛擬結(jié)構(gòu)的實(shí)現(xiàn)，發(fā)現(xiàn)在的地方。然而慢慢的人們發(fā)現(xiàn)，在我們的代碼中布滿了一系列操作的代碼。源碼解析系列源碼解析一準(zhǔn)備工作源碼解析二函數(shù)源碼解析三對象源碼解析四方法源碼解析五鉤子源碼解析六模塊源碼解析七事件處理個人博客地址 前言 虛擬 DOM 結(jié)構(gòu)概念隨著 react 的誕生而火起來，之后 vue2.0 也加入了虛擬 DOM 的概念。 閱讀 vue 源碼的時候，想了解...

    defcon 評論0 收藏0

  • snabbdom源碼解析（三） vnode對象

    摘要：對象是一個對象，用來表示相應(yīng)的結(jié)構(gòu)代碼位置定義類型定義類型選擇器數(shù)據(jù)，主要包括屬性樣式數(shù)據(jù)綁定時間等子節(jié)點(diǎn)關(guān)聯(lián)的原生節(jié)點(diǎn)文本唯一值，為了優(yōu)化性能定義的類型定義綁定的數(shù)據(jù)類型屬性能直接用訪問的屬性樣式類樣式數(shù)據(jù)綁定的事件鉤子創(chuàng)建對象根據(jù)傳入的 vnode 對象 vnode 是一個對象，用來表示相應(yīng)的 dom 結(jié)構(gòu) 代碼位置 ：./src/vnode.ts 定義 vnode 類型 /** ...

    willin 評論0 收藏0

  • snabbdom源碼解析（七） 事件處理

    摘要：這種解決方式也是相當(dāng)優(yōu)雅，值得學(xué)習(xí)源碼解析系列源碼解析一準(zhǔn)備工作源碼解析二函數(shù)源碼解析三對象源碼解析四方法源碼解析五鉤子源碼解析六模塊源碼解析七事件處理個人博客地址 事件處理 我們在使用 vue 的時候，相信你一定也會對事件的處理比較感興趣。 我們通過 @click 的時候，到底是發(fā)生了什么呢！ 雖然我們用 @click綁定在模板上，不過事件嚴(yán)格綁定在 vnode 上的 。 event...

    Kross 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<