解决Element ui组件的Message消息弹框,因多次点击导致的满屏弹框
局部处理
this.$message.closeAll();
全局处理
如果多个页面有弹框当然需要全局处理了,不然一个个放太麻烦了,在src/assets/js文件夹里面添加个resetMessage.js文件
然后再main.js里面引入
源码放下面了↓↓↓↓↓↓↓
import { Message} from 'element-ui'; // 引入messagelet messageInstance = null;const resetMessage = (options) => { if (messageInstance) { messageInstance.close() //关闭 } messageInstance = 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 const message = resetMessage
// 防止多次点击后导致的满屏弹框提示import { message} from './api/resetMessage.js';Vue.prototype.$message = message;













网友评论