Vue.use的源码:
Vue.use = function (plugin: Function | any) {
const installedPlugins =
this._installedPlugins || (this._installedPlugins = [])
if (installedPlugins.indexOf(plugin) > -1) {
return this
}
// additional parameters
const args = toArray(arguments, 1)
args.unshift(this)
if (isFunction(plugin.install)) {
plugin.install.apply(plugin, args)
} else if (isFunction(plugin)) {
plugin.apply(null, args)
}
installedPlugins.push(plugin)
return this
}
解析:
const installedPlugins = this._installedPlugins || (this._installedPlugins = [])
首先检查是否存在this._installedPlugins,如果存在则赋值给installedPlugins,否则将创建一个空数组并赋值给this._installedPlugins和installedPlugins。if (installedPlugins.indexOf(plugin) > -1) { return this }
检查插件是否已经安装过,如果已经安装过,则直接返回Vue实例。这避免了重复安装同一个插件。const args = toArray(arguments, 1)
这里调用了toArray方法,将arguments对象从索引1开始转换为一个真正的数组,并将结果赋值给argsargs.unshift(this)
在args数组的开头添加this,也就是Vue实例自身。这是为了在调用插件的install方法或插件本身时传递Vue实例作为第一个参数。if (isFunction(plugin.install)) { plugin.install.apply(plugin, args) }
如果插件具有install方法,就调用这个方法。这是Vue插件的约定,install方法会接收Vue实例和一些其他参数。通过apply将args数组作为参数传递给install方法。else if (isFunction(plugin)) { plugin.apply(null, args) }
如果插件本身是一个函数而不是一个包含install方法的对象,就直接调用这个函数,并传递args数组作为参数。installedPlugins.push(plugin)
将插件添加到installedPlugins数组,以记录已安装的插件。return this
返回Vue实例,以支持链式调用。