先看Vue.use做了什么
Vue.use = function (plugin: Function | Object) {
//Vue構(gòu)造函數(shù)上定義_installedPlugins 避免相同的插件注冊多次
const installedPlugins = (this._installedPlugins || (this._installedPlugins = []))
// import是單例模式
//所以plugin不論是Fuction還是Object同一個(gè)插件都是同一個(gè)
if (installedPlugins.indexOf(plugin) > -1) {
return this
}
// additional parameters
const args = toArray(arguments, 1)
// Vue作為第一個(gè)參數(shù)傳遞給插件
args.unshift(this)
if (typeof plugin.install === 'function') {
plugin.install.apply(plugin, args)
} else if (typeof plugin === 'function') {
plugin.apply(null, args)
}
installedPlugins.push(plugin)
return this // 返回的是this,可以鏈?zhǔn)秸{(diào)用
}
do:
- 檢查插件是否已經(jīng)注冊，相同的插件只注冊一次
- 將Vue構(gòu)造函數(shù)作為第一個(gè)參數(shù)误算，作為插件注冊調(diào)用
- 根據(jù)插件形式選擇調(diào)用plugin.install還是plugin
- 存儲已注冊插件妒茬，用于插件是否已注冊檢驗(yàn)
Vue.prototype._init中合并options
Vue.prototype._init = function (options?: Object) {
const vm: Component = this
// a uid
vm._uid = uid++
let startTag, endTag
...
vm.$options = mergeOptions(
resolveConstructorOptions(vm.constructor),
options || {},
vm
)
...
// 掛載到dom上
if (vm.$options.el) {
vm.$mount(vm.$options.el)
}
}
在new Vue(options)時(shí)首先會執(zhí)行this._init進(jìn)行初始化担锤，將Vue上的屬性和options進(jìn)行合并，然后在進(jìn)行事件乍钻、生命周期等的初始化肛循。beforeCreate,created生命周期的hook函數(shù)也是在這里進(jìn)行調(diào)用
如果Vue.use在new Vue()之后執(zhí)行，this._init()時(shí)你使用的插件的內(nèi)容還沒有添加到Vue.options.components银择、Vue.options.directives多糠、Vue.options.filters等屬性中。所以新初始化的Vue實(shí)例中也就沒有插件內(nèi)容
