vue中使用element-ui，重复点击按钮或多个请求同时报错时弹出多个message弹框解决方法

目中使用element-ui时，message弹框功能是必须使用的，有时会在点击按钮时提示无权限，或者请求报错时给出适当提示：

 

但是重复点击按钮或者同一个页面多个请求同时报错时，就不美观了

 

 

可以看到，element-ui是动态往页面根节点插入message元素来实现弹框效果的，都拥有el-message属性

 

那么我们就可以通过判断页面中message的个数来决定要不要弹出第二个提示框

这就需要重新写一下element-ui的message

resetMessage.js

main.js引入

import {
  message
} from '@/utils/resetMessage';
、、、、
Vue.use(ElementUI)
Vue.prototype.$message = message;
全局调用方法：

this.$message.error('hello')或者this,$message.error({message:'hello'})

注意：挂载自定义message必须放在Vue.use(ElementUI)后面，才能覆盖element-ui默认的message，不然没有效果

这样就不用担心重复点击会弹出好多弹框了