一、插件的功能
- 添加全局方法或者 property。如:
vue-custom-element
- 添加全局资源:指令/过滤器/过渡等。如
vue-touch
- 通过全局混入来添加一些组件选项。如
vue-router
- 添加 Vue 实例方法,通过把它们添加到
Vue.prototype
上实现。 - 一个库,提供自己的 API,同时提供上面提到的一个或多个功能。如
vue-router
二、插件的使用
- 通过全局方法
Vue.use()
使用插件。
通过全局方法 Vue.use()
使用插件。需要在你调用 new Vue()
启动应用之前完成
var Vue = require('vue')
var VueRouter = require('vue-router')
Vue.use(VueRouter)
- 通过原形函数对象
Vue.prototype.$
进行实例,让实例能够全局调用。
Vue社区中的大量插件与库
三、开发插件(几个主要的方法)
install ()
方法(插件必备,Vue.use()
调用的方法)- directive方法------添加全局资源
- mixin方法----------注入组件选项
- Vue.prototype.$myMethod = function (methodOptions) {
// 逻辑…
}-------添加实例方法
MyPlugin.install = function (Vue, options) {
Vue.myGlobalMethod = function () {
}
Vue.directive('my-directive', {
bind (el, binding, vnode, oldVnode) {
}
...
})
Vue.mixin({
created: function () {
}
...
})
Vue.prototype.$myMethod = function (methodOptions) {
}
}