當(dāng)數(shù)據(jù)發(fā)生改變時(shí)放航,訂閱者watcher就會(huì)調(diào)用patch給真實(shí)的DOM打補(bǔ)丁
通過isSameVnode進(jìn)行判斷帖旨,相同則調(diào)用patchVnode方法相嵌。
patchVnode做了以下操作:
找到對(duì)應(yīng)的真實(shí)dom,稱為el
1傀缩、如果都有都有文本節(jié)點(diǎn)且不相等漆魔,將el文本節(jié)點(diǎn)設(shè)置為Vnode的文本節(jié)點(diǎn)
2屁柏、如果oldVnode有子節(jié)點(diǎn)而VNode沒有,則刪除el子節(jié)點(diǎn)
3有送、如果oldVnode沒有子節(jié)點(diǎn)而VNode有淌喻,則將VNode的子節(jié)點(diǎn)真實(shí)化后添加到el
4、如果兩者都有子節(jié)點(diǎn)雀摘,則執(zhí)行updateChildren函數(shù)比較子節(jié)點(diǎn)
updateChildren主要做了以下操作:
1裸删、設(shè)置新舊VNode的頭尾指針
2、新舊頭尾指針進(jìn)行比較阵赠,循環(huán)向中間靠攏涯塔,根據(jù)情況調(diào)用patchVnode進(jìn)行patch重復(fù)流程、3清蚀、調(diào)用createElem創(chuàng)建一個(gè)新節(jié)點(diǎn)匕荸,從哈希表尋找 key一致的VNode 節(jié)點(diǎn)再分情況操作