vue全局提示插件开发-toast

前言

在没有封装插件之前，如果不使用第三方插件，那么很多情况下我们会编写几个常用的组件来提供给页面使用，如Alert/Loading组件，而你可能需要在很多页面中引入并且通过components注册组件，但是像这样使用率很高的组件一般我们希望全局注册后直接就可以在相应页面使用，因此我们需要将他们封装成插件，这里我们编写一个toast全局提示插件来作个简单的介绍

插件

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

1.添加全局方法或者 property。

2.添加全局资源：指令/过滤器/过渡等。

3.通过全局混入来添加一些组件选项。

4.添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现。

5.一个库，提供自己的 API，同时提供上面提到的一个或多个功能。

vue插件的编写方法一般分为以上5类，其注册与绑定机制如下：

export default {
    install(Vue, options) {
        Vue.myGlobalMethod = function () {  // 1. 添加全局方法或属性，如:  vue-custom-element
            // 逻辑...
        }
        Vue.directive('my-directive', {  // 2. 添加全局资源：指令/过滤器/过渡等，如 vue-touch
            bind (el, binding, vnode, oldVnode) {
                // 逻辑...
            }
            ...