我們在之前分析_createElement的時候,曾經執(zhí)行過這樣一段邏輯
之前我們的render方法是這樣的
這次我們的render方法是這樣的
它(tag)接收一個組件對象,因此tag==‘string’不成立脾歧,走else状勤,調用createComponent方法,入參如下
首先判斷了Ctor是否存在颅拦,我們這里是一個組件對象逆甜,因此向下
當分析npm run build的時候衣洁,我們找到了entry-runtime-with-compiler文件墓捻,這是打包后的入口,我們又通過該文件對vue的引用一級一級去查找vue的定義坊夫,其中在src\core\index.js中我們調用了initGlobalAPI砖第,而在該函數(shù)中,我們將vue掛載到了Vue.options._base上环凿,即
因此梧兼,baseCtor和context一樣,即Vue實例
接著調用Vue.extend方法
該方法在initGlobalAPI的時候被掛載至vue
在該方法中做了以下幾件事
首先
? ? 使用單例模式保證多次import得到的是同一個實例
? ? 然后創(chuàng)建一個組件類并使其繼承Vue并返回?
????這樣就使得類Sub(即Ctor)擁有了和Vue一樣的能力
代碼向下智听,定義data={}羽杰,并將其作為參數(shù)傳遞,執(zhí)行installComponentHooks
該方法向data上掛載了hook
hook的值是
此時到推,data大概長這樣
接著便開始生成vnode
Vnode入參如下
生成的vnode如下
那么考赛,組件Vnode又是如何被轉化為dom的呢?()