1、在utils文件夾下創(chuàng)建messageOnce.js文件剥槐,封裝message對象類
import {Message} from 'element-ui'
// 私有屬性熙宇,只在當(dāng)前文件可用
const showMessage = Symbol('showMessage')
export default class domMessage {
success (options, single = true) {
this[showMessage]('success', options, single)
}
warning(options, single = true) {
this[showMessage]('warning', options, single)
}
info(options, single = true) {
this[showMessage]('info', options, single)
}
error(options, single = true) {
this[showMessage]('error', options, single)
}
[showMessage] (type, options, single) {
if (single) {
// 關(guān)鍵代碼亏栈,判斷當(dāng)前頁是否有el-message標(biāo)簽,如果沒有則執(zhí)行彈窗操作
if (document.getElementsByClassName('el-message').length === 0) {
Message[type](options)
}
} else {
Message[type](options)
}
}
}
2投放、在axios全局配置中引入messageOnce.js文件奈泪,用messageOnce.js中創(chuàng)建好的類進(jìn)行報錯提示即可
import domMessage from '@/utils/messageOnce'
const messageOnce = new domMessage()
messageOnce.error({message:'錯誤提示'});