Vue 實例掛載！

屏幕快照 2021-06-17 下午2.24.59.png

1.png

這段代碼首先緩存了原型上的 $mount 方法，再重新定義該方法。

2.png

3.png

4.png

5.png

mount 方法實際上會去調(diào)用 mountComponent 方法。

6.png

7.png

。
從上面的代碼可以看到，mountComponent 核心就是先實例化一個渲染W(wǎng)atcher，在它的回調(diào)函數(shù)中會調(diào)用 updateComponent 方法，在此方法中調(diào)用 vm._render 方法先生成虛擬 Node，最終調(diào)用 vm._update 更新 DOM。
Watcher 在這里起到兩個作用，一個是初始化的時候會執(zhí)行回調(diào)函數(shù)，另一個是當 vm 實例中的監(jiān)測的數(shù)據(jù)發(fā)生變化的時候執(zhí)行回調(diào)函數(shù)