在新版本的element中，官方对  message消息提示 做了修改，修改成一个请求对应一个提示语，这就会导致一个多条消息提示共存的一个问题，而很多情况下，这多条消息提示的内容是一样的，从用户的体验来说，并不友好

我们可以通过 重写 message 来解决这个问题

首先 先写一个resetMessage.js

import {

    Message

} from 'element-ui';

const showMessage = Symbol('showMessage');

let messageItem = null;

class ResetMessage {

    [showMessage](type, options, only) {

        if (messageItem && only) {

            messageItem.close()

        }

        messageItem = Message[type](options)

    }

    success(options, only = true) {

        this[showMessage]('success', options, only)

    }

    error(options, only = true) {

        this[showMessage]('error', options, only)

    }

    warning(options, only = true) {

        this[showMessage]('warning', options, only)

    }

    info(options, only = true) {

        this[showMessage]('info', options, only)

    }

}

export const message = new ResetMessage();

第二步,在 main.js 中引入

import {

    message

  } from './assets/js/resetMessage';

Vue.prototype.$message = message; //重写message提示框

 这样就解决了 ，多条消息提示共存的问题，页面中始终只会存在一个消息提示

原文链接：https://blog.csdn.net/weixin_40297452/article/details/102968785