Vue 插件编写

vue插件介绍

2. 插件分类   

插件类型

主要注册与绑定机制如下:

    export default{
        install(Vue,options){
                Vue.myGlobalMethod= function(){                      // 1. 添加全局方法或属性,如: vue-custom-element
                                // 逻辑...
                  }
                 Vue.directive('my-directive',{                                // 2. 添加全局资源:指令/过滤器/过渡等,如
                             vue-touchbind(el,binding,vnode,oldVnode){
                                // 逻辑...
                            }
                   })
                 Vue.mixin({  created:function(){                           // 3. 通过全局 mixin方法添加一些组件选项,如: vuex
                                // 逻辑...}...
                    })
                  Vue.prototype.$myMethod=function(options){// 4. 添加实例方法,通过把它们添加到 Vue.prototype 上实现
                                // 逻辑...}}
                    }

3. 插件使用

    在plugins.js中我们仅仅编写了一个插件的空壳子,假如现在需要全局注册该插件,我们可以在入口文件,比如main.js中注册:

...
import Vue from'vue'
import MyPlugin from './plugins/plugins.js'
Vue.use(MyPlugin);
...

通过全局方法 Vue.use() 即可使用该插件,其自动会调用install方法。Vue.use会自动阻止注册相同插件多次,届时只会注册一次该插件。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,270评论 0 4
  • 转至元数据结尾创建: 董潇伟,最新修改于: 十二月 23, 2016 转至元数据起始第一章:isa和Class一....
    40c0490e5268阅读 1,776评论 0 9
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,986评论 19 139
  • 她的睫毛微微颤动, 仿若蝴蝶即将翩跹起舞。
    20000字阅读 176评论 0 0
  • 作者/成炜 在孤寂的怀抱中, 诗意与疯狂交战, 疯狂高举着鲜红...
    苏汐扬阅读 281评论 4 3