...
大前端

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;
  },
};
最新版 ADB 工具下载与使用指南 uniapp全局弹窗APP做全局弹窗(dialog)插件的思路
biu biu biu
雨霖铃·寒蝉凄切 win10 route add 添加静态路由,双网卡一个内网一个外网路由配置,双网关路由配置 PHP读取远程URL出现 file_get_contents(): SSL operation failed with code 1. OpenSSL vue 脚手架 sass安装 安装淘宝镜像源 cnpm 教程