最近項(xiàng)目需求接口返回錯(cuò)誤提示芋膘，可自動(dòng)換行且手動(dòng)關(guān)閉
image.png
自定義方法如下：
const msgWarn=(dom,content,duration,onClose)=>{
// dom 通常在methods方法內(nèi)傳this
// content 返回錯(cuò)誤提示消息（以<br/>分割）
// duration 停留時(shí)間
// onClose 關(guān)閉回調(diào)
//自定義測(cè)試數(shù)據(jù)
conent="測(cè)試11111111111111111111111111<br/>測(cè)試22222222222222222222<br/>測(cè)試33333"
let _node;
// 創(chuàng)建 VNode
const el=dom.$createElement;
// 分割字符串
let contents = content.split("<br/>");
// 接收信息
let arr=[];
contents.forEach(ele => {
let innerText = el('div', { style: { color: '#000000A6',paddingRight:'13px',paddingLeft:'13px' } }, ele);
arr.push(innerText)
});
}
// 定義關(guān)閉按鈕
let innerIcon = el('a-icon', {
style: { marginRight: '0px', marginLeft: '20px', color: '#ccc', cursor: 'pointer',position:'absolute',right:'-8px' },
attrs: { type: 'close' },
on: { click: () => _remove() }
})
// 定義提示按鈕
let warningIcon = el('a-icon', {
style: { position:'absolute',left:'-8px' },
attrs: { type: 'warning' }
});
arr.push(innerIcon);
arr.push(warningIcon);
// 自定義包裝容器
let box=el('div', { style: { position:'relative',textAlign:'left' } }, arr);
let container = el('span', {}, [box]);
let defaultIcon=el('span',{},[]);
// 調(diào)用 內(nèi)置message 組件
_node = dom.$message.warning({
content: container,
duration: duration || 0,
onClose: onClose,
icon: defaultIcon
})
// 全局配置
Vue.prototype.$msgWarn= msgWarn
// 調(diào)用
this.$msgWarn(this,"my content");
