? ? ? ?在新版本的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