vue 做一个插件plugin 插件的创建(install)及使用方法
接上篇(https://www.vsay.net/web/279.html ),要做一个全局调用的dialog(web),这种方法只能在web下使用,小程序我还没测哈。
// plugins/dialog.js
import Vue from 'vue';
import MyDialog from '@/components/MyDialog.vue';
const DialogConstructor = Vue.extend(MyDialog);
let instance;
const initInstance = () => {
instance = new DialogConstructor({
el: document.createElement('div'),
data() {
return {
visible: false,
message: '',
};
},
});
document.body.appendChild(instance.$el);
};
const showDialog = (options = {}) => {
if (!instance) {
initInstance();
}
instance.message = options.message || '';
instance.visible = true;
return new Promise((resolve, reject) => {
instance.$on('confirm', () => {
resolve();
});
instance.$on('close', () => {
reject();
});
});
};
export default {
install(Vue) {
Vue.prototype.$dialog = showDialog;
},
};