vue 插件
开发插件
插件通常会为vue添加全局功能,插件的范围没有限制--一般有下面几种:
1,添加全局方法或者属性,例:vue-coustom-element
2,添加全局资源:指令、过滤器,、过渡等,如vue-touch;
3,通过全局mixin方法添加一些组件选项,如:vue-router;
4,添加vue实例方法,通过把它们添加到vue.property上实现。
5,一个库,提供自己的api,同时提供上面提到的一个或多个功能,如,vue-router.
vue的插件应当有一个公开的方法install。这个方法的第一个参数是vue构造器,第二个参数是一个可选的选项对象:
MyPlugin.install = function(vue,options){
//1.添加全局方法或属性
Vue.myGlobalMethod = function(){
//逻辑
}
//添加全局资源
vue.directive('my-directive',{
bind(el,binding,vnode,oldVnode){
//逻辑
}
})
//注入组件
Vue.mixin({
created:function(){
//逻辑
}
})
//添加实例方法
Vue.prototype.$myMethod = function(methodOptions){
//逻辑
}
}
使用插件
通过全局方法vue.use()使用插件
//调用MyPlugin.install(vue)
Vue.use(MyPlugin);
也可以传入一个选项对象:
Vue.use(MyPlugin,{someOption:true})
Vue.use会自动阻止注册相同插件多次,届时只会注册一次该插件。
Vue.js官方提供的一些插件(例:vue-router)在检测到Vue是可访问的全局变量时会自动调用Vue.use()。然而在例如Commonjs的模块环境中,你应该显式的调用Vue.use()。
//用browserify或webpack提供的commonjs模块环境
var Vue = require('vue');
var VueRouter = require('vue-router')
//不要忘了调用vue.use(VueRouter)
awesome-vue 集合了来自社区贡献的数以千计的插件和库。
vue 插件的更多相关文章
- vue插件编写与实战
关于 微信公众号:前端呼啦圈(Love-FED) 我的博客:劳卜的博客 知乎专栏:前端呼啦圈 前言 热爱vue开发的同学肯定知道awesome-vue 这个github地址,里面包含了数以千计的vue ...
- 第一个Vue插件从封装到发布
前言 这是我封装的第一个Vue插件,实现的功能是滑动选择省市区,虽然只是一个简单的插件,但还是挺开心的,记录一下步骤. 插件地址:https://github.com/leichangchun/vue ...
- 手把手教你写vue插件并发布(二)
前记:上一篇 https://www.cnblogs.com/adouwt/p/9211003.html, 说到了一个完整的vue插件开发.发布的流程,总结下来就讲了这么一个事,如何注入vue, 如果 ...
- VUE插件大总结
UI组件 element - 饿了么出品的Vue2的web UI工具套件 Vux - 基于Vue和WeUI的组件库 mint-ui - Vue 2的移动UI元素 iview - 基于 Vuejs 的开 ...
- vue插件大全汇总
Vue是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件特别整理了常用的vue插件,来了个大汇总,方便查找使用,便于工作 ...
- VUE插件总结
亲们支持我的新博客哦==>地址(以后更新会尽量在新博客更新,欢迎大家访问加入我的后宫w) ) UI组件 element - 饿了么出品的Vue2的web UI工具套件 Vux - 基于Vue和W ...
- Vue插件plugins的基本操作
前面的话 本文将详细介绍Vue插件plugins的基本操作 开发插件 插件通常会为 Vue 添加全局功能.插件的范围没有限制——一般有下面几种: 1.添加全局方法或者属性,如: vue-custom- ...
- 把axios封装为vue插件使用
前言 自从Vue2.0推荐大家使用 axios 开始,axios 被越来越多的人所了解.使用axios发起一个请求对大家来说是比较简单的事情,但是axios没有进行封装复用,项目越来越大,引起的代码冗 ...
- Vue插件写、用详解(附demo)
出处http://blog.csdn.net/qq20004604 Vue插件 1.概述 简单来说,插件就是指对Vue的功能的增强或补充. 比如说,让你在每个单页面的组件里,都可以调用某个方法,或者共 ...
- 推荐 VSCode 上特别好用的 Vue 插件 - vetur
作者 @octref 此前 V2EX 发过帖子,最近新增代码补全功能,综合比较应该是目前 VSCode 上面最好用的 Vue 插件. 能够实现在 .vue 文件中: 语法错误检查,包括 CSS/SCS ...
随机推荐
- vmware 下 ubuntu 不能全屏显示 的解决方法
vmware 下 ubuntu 不能全屏显示 在 vmware 下 安装 ubuntu后,默认分辨率是 800 * 600,可以设置以全屏显示: 设置步骤: vmware 下启动 虚拟机,即 启动 u ...
- AWR报告简易分析
Snap Id Snap Time Sessions Cursors/Session Begin Snap: 35669 2012-11-8 13:00 1246 11.3 End Snap: 356 ...
- centos7 keepalived以及防火墙配置
安装和配置keepalived,网上有很多资料,但是都没有提到防火墙这块,而且很多都是互相抄袭的,就算配置对了也会遇到很多问题 在查阅资料的时候配置好了keepalived,但是出现了裂脑,即两台服务 ...
- Tile based Rendering //后面一段是手机优化建议
https://www.imgtec.com/blog/a-look-at-the-powervr-graphics-architecture-tile-based-rendering/ 一种硬件结构 ...
- Python datetime 格式化字符串:strftime()
Python datetime 格式化字符串:strftime() Python 的datetime模块 其实就是date和time 模块的结合, 常见的属性方法都比较常用 比如: datetim ...
- HDU-2665-Kth number(划分树)
Problem Description Give you a sequence and ask you the kth big number of a inteval. Input The fir ...
- ssm整合(Spring+SpringMVC+Mybatis)
一.Spring Spring致力于提供一种方法管理你的业务对象.IOC容器,它可以装载bean(也就是我们java中的类,当然也包括service dao里面的),有了这个机制,我们就不用在每次使用 ...
- Win7无法安装Flash Player怎么办
在IE的工具选项中把安全选项中的ActiveX控件一系列都改为启用即可.
- 对PHP中类、继承、抽象的理解(个人总结)
1,PHP中的类可以被继承:A extends B. 2,类被声明为abstract时:a.该类就仅仅包含模版,我们就不能创建该类的实例对象,必须通过继承来使用new创建对象. b.继承一个抽象类的时 ...
- js实现全选,全不选,反选
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...