Vue源码分析--Vue.use

Vue源码分析–Vue.use

直接上源码吧

export function initUse (Vue: GlobalAPI) {
  // 绑定静态方法 Vue.use(plugin: Function | Object)
  Vue.use = function (plugin: Function | Object) {
    // 每次绑定的插件都要保存到this._installedPlugins 数组中，避免重复绑定
    const installedPlugins = (this._installedPlugins || (this._installedPlugins = []))
    if (installedPlugins.indexOf(plugin) > -1) {
      return this
    }

    // 获取plugin后面的所有参数，并组成数组
    const args = toArray(arguments, 1)
    // plugin方法的第一个参数是Vue
    args.unshift(this)
    if (typeof plugin.install === 'function') {
      // plugin: Object是为了在执行install时，取plugin对象的其他属性
      plugin.install.apply(plugin, args)
    } else if (typeof plugin === 'function') {
      plugin.apply(null, args)
    }
    // 注册成功后，保存到已注册的数组中
    installedPlugins.push(plugin)
    return this
  }
}

再来看看API调用

Vue.use(plugin: Function | Object, ...args)
// plugin: Function 就等价于
plugin(Vue, ...args)
// plugin: Object 
plugin.install(Vue, ...args)