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會自動阻止注冊相同插件多次,屆時只會注冊一次該插件。