day2-自定义插件

自定义插件的用途

插件通常用来给Vue添加全局功能。插件的功能范围一般没有严格的限制，主要有下面几种：

1. 添加全局方法或property
2. 添加全局资源
3. 通过全局混入来添加一些组件选项
4. 添加vue实例方法，通过他们添加到Vue.prototype上实现
5. 一个库，实现自己的api

自定义插件的使用

使用自定义插件，Vue.use这句话一定要写。插件一般在js文件中定义。Vue.use会自动阻止多次注册相同组件，届时即使多次调用也只会注册一次该插件。

定义一个插件，install是必须要写的，并要暴露这个方法。
这个方法的第一个参数是Vue构造器，第二个参数可选参数选项

在js文件中定义一个插件 plugin.js。

// 插件在js文件中定义

(function (window) {

  // 定义了一个对象
  const MyPlugin = {}
  // 定义一个插件，install是必须要写的。
  MyPlugin.install = function (Vue) {
    //  1  定义一个全局的方法
    Vue.myGlobalMethod = function () {
      console.log('全局的方法')
    }
    // 2 定义一个指令（不是必须）
    Vue.directive('upper', function () {
      console.log('哈哈')
    })
    // 3 定义一个实例方法
    Vue.prototype.$myMethod = function () {
      console.log('我是一个实例方法')
    }
  }

  // 暴露出前面的对象
  window.MyPlugin = MyPlugin
})(window)

Vue中引入这个plugin.js，并通过Vue.use()进行调用

// 声明使用vue的插件
    Vue.use(MyPlugin)

// 可以调用全局的方法
    Vue.myGlobalMethod()