Vue.use

用法

在项目中我们经常使用到Vue.use，比如Vue.use(ElementUI),Vue.use(vueRouter),那么我们来看一看Vue的使用方法。

Vue.use接收的是一个函数或者是一个对象，如果已经注册过此插件了那么就不会再进行注册
1.如果传进来的是对象的话，这个对象里面包含一个install方法那么直接让install这个函数执行并且将这个对象作为install中的this让install执行，然后将Vue和其他定义的参数作为参数传递给install函数

let a ={
  install(Vue,a,b){
    console.log(Vue,a,b,this);
  }
}
Vue.use(a,1,2)

2.如果传进来的是函数的话那么直接让这个函数执行，并且让null作为这个函数的this(也就是将window作为这个函数的this)，然后将Vue和其他定义的参数作为参数传递给install函数

function a(Vue,a,b){
  console.log(Vue,a,b,this);
}
Vue.use(a,1,2)

Vue.use源码

import { toArray } from '../util/index'
export function initUse (Vue: GlobalAPI) {
//接受的是函数或者对象
  Vue.use = function (plugin: Function | Object) {
    const installedPlugins = (this._installedPlugins || (this._installedPlugins = []))
//installedPlugins缓存机制，如果存在那么直接return
    if (installedPlugins.indexOf(plugin) > -1) {
      return this
 }
 //将传进来的自定义参数转换成数组
 const args = toArray(arguments, 1)
 //将Vue当做第一个参数，比如install(Vue)这里能直接能拿到Vue
    args.unshift(this)
    //如果是对象的话，里面会有一个install函数
    if (typeof plugin.install === 'function') {
    //直接执行并将这个对象作为函数的this,并将参数传过去
      plugin.install.apply(plugin, args)
      //如果传进来的是一个函数的话
    } else if (typeof plugin === 'function') {
     //直接执行并将null作为函数的this,并将参数传过去
      plugin.apply(null, args)
    }
    installedPlugins.push(plugin)
    return this
 }
}