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

1. 用这种

export const haslogin = { show: false }

if (!haslogin .show) {
        haslogin .show = true
        MessageBox.confirm('登录状态已过期', '系统提示', {
          confirmButtonText: '重新登录',
          cancelButtonText: '取消',
          type: 'warning'
        }
        ).then(() => {
          haslogin .show = false
          store.dispatch('login/logout')
          router.push('/login')
        }).catch(() => {
          haslogin .show = false
        })
}
return Promise.reject('无效的会话或者会话已过期，请重新登录。')

2.

/** 重置message，防止重复点击重复弹出message弹框 */
import {
  Message
} from 'element-ui'
let 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 default resetMessage

文件中引入使用

if (res.data.code === 401) {
      resetMessage.error('无效的会话，或者会话已过期，请重新登录。')
      store.dispatch('login/logout')
      router.push('/login')
      return res
}

参考：

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