我們跳過mergedata
以及mergedataorfn
,我們暫且不關注這兩個函式的作用。暫且跳過繼續看下面的**:
strats.data = function( parentval: any,
childval: any,
vm?: component
): ?function
return
mergedataorfn(parentval, childval)
} return
mergedataorfn(parentval, childval, vm)
}
在strats策略物件上面新增了乙個data策略函式,進行選項data的策略合併
if (childval && typeof childval !== 'function') {}
判斷是否又子元件的data,並且檢測是否是乙個function,如果不是函式則會警告,並且返回parentval
如果childval是函式 則會返回mergedataorfn(parentval, childval) 執行結果
後面就不用說了, 如果又vm 就執行mergedataorfn(parentval, childval, vm)
接下來我們看看一直呼叫的mergedataorfn函式是什麼:
/*** data
*/export function mergedataorfn (
parentval: any,
childval: any,
vm?: component
): ?function
if (!parentval)
// when parentval & childval are both present,
// we need to return a function that returns the
// merged result of both functions... no need to
// check if parentval is a function here because
// it has to be a function to pass previous merges.
return function mergeddatafn ()
} else else
}}}
整體的也是和之前的幾個函式一樣 首先對vm的判斷,其中就mergedata函式需要介紹下,看下mergedata原始碼,這個函式是用來幹嘛的
/*** helper that recursively merges two data objects together.
*/function mergedata (to: object, from: ?object): object else if (isplainobject(toval) && isplainobject(fromval))
// 其他情況什麼都不做
} return to
}
接收兩個引數,to,from;
根據呼叫傳參to
對應的是childval
產生的純物件,from
對應parentval
產生的純物件
這個函式作用就是:將from
物件的屬性混合到to
物件中,也可以說是將parentval
物件的屬性混合到childval
中,最後返回的是處理後的childval
物件。
合併階段strats.data
將被處理成乙個函式,但是這個函式並沒有被執行,而是到了後面初始化的階段才執行的,
重點:!!!!!!!!!!!
mergedata
函式只有在初始化的時候才會執行,進行資料合併;
vue
的初始化的時候,inject
和props
這兩個選項的初始化是先於data
選項的,這就保證了我們能夠使用props
初始化data
中的資料
Vue 原始碼之 nextTick 解析
最近在看 vue 原始碼,一直很好奇這個 nexttick 怎麼實現。本文涉及微任務和巨集任務,不熟悉的可以看我之前的部落格 在瀏覽器環境中,常見的 macro task 有 settimeout messagechannel postmessage setimmediate。而常見的 micro ...
Vue原始碼解析
原始碼位置 src core vdom patch.js updatechildren 作用 key的主要作用是高效的更新虛擬dom,原始碼中在patch的過程中,會執行patchvnode,patchvode過程中會執行updatechildren方法,會更新兩個新舊的子元素,通過key可以準確的...
Vue之Watcher原始碼解析(1)
上一節最後再次呼叫了mount函式,我發現竟然跳到了7000多行的那個函式,之前我還說因為宣告早了被覆蓋,看來我錯了!就是這個函式 line 7531 vue 3.prototype.mount function el,hydrating 第一步query就不用看了,el此時是乙個dom節點,所以直...