vue+elementUI重复点击导致多个弹框出现解决方案

需求：系统中提示多个弹框不能同时出现，一次只弹出一个弹框

新建resetMessage.js

/** 防止重复点击重复弹出message弹框 **/
import { Message } from 'element-ui';

const resetMessage = (options) => {
  if (document.getElementsByClassName('el-message').length){
    Message.closeAll()
  }
  Message(options)
};

['error','success','info','warning'].forEach(type => {
  resetMessage[type] = options => {
    if (typeof options === 'string') {
      options = {
        message: options
      }
    }
    options.type = type
    return resetMessage(options)
  }
})

export default resetMessage;

全局使用：在main.js中引入

import resetMessage from '@/util/resetMessage'
Vue.prototype.$resetMessage = resetMessage

参考的大佬的方法：vue中使用element-ui，重复点击按钮或多个请求同时报错时弹出多个message弹框解决方法
但是实际直接使用没法覆盖原有的$message，关闭时候判断还是采取了判断元素是否存在的方法，关闭弹框使用了closeAll()方法

如果大家想一起交流学习，共同进步，欢迎搜索公众号“是日前端”，输入关键词如：前端基础，获取资料，资料刚开始整理，目前还在完善中，点击交流群按钮进交流群，群里仅限技术交流、面试交流等，需要其它相关资料可以群里说，后续交流群人数增多会考虑特色内容，再次感谢大家的支持~