ElMessage多次弹窗问题

在封装请求拦截器时，使用ElMessage进行弹窗提示成功或失败，但是如果页面用到多个接口，这时就会导致页面出现很多弹窗，导致用户体验不好，有可能出现卡顿，

这时就需要进行一些判断，如果前面的ElMessage还没关闭并且类型是一致的就return，不再弹窗提示，类型不一致时就要弹窗提示

完整的代码

import { ElMessage, MessageHandler } from 'element-plus';

let prevType = '';
let prevInstance: MessageHandler | null = null;

interface MessageOptions {
  message: string;
  type: 'success' | 'warning' | 'info' | 'error';
  center?: boolean;
  duration?: number;
  showClose?: boolean;
}

function showMessage(options: MessageOptions) {
  const { type } = options;
  //判断弹窗的类型是不是一致，一致就不弹出
  if (prevInstance && prevType === type) {
    return;
  }
  prevType = type;

  if (prevInstance) {
    prevInstance.close();
  }

  prevInstance = ElMessage({
    ...options,
    onClose: () => {
      prevType = '';
    }
  });
}

export default showMessage;

使用

import showMessage from './showOneMsg';
showMessage({
         message: response.data.msg || 'success',
        type: 'success'
  })