為什么頭頂越來越禿二打？
還不是因?yàn)榭蛻舻囊笤絹碓蕉啵?/p>
一個(gè)快完成的項(xiàng)目
要求所有的提示框消失時(shí)間延長逃延，并且可以手動(dòng)關(guān)閉
這并沒有什么
但是100苦锨、200個(gè)文件里都用到$message
一個(gè)一個(gè)改要哭哦
但是位岔！
看了Element 文檔發(fā)現(xiàn)谤专，Element 已經(jīng)為 Vue.prototype 添加了全局方法 $message校赤，我們只需要全局重寫 $message 即可
簡直不要太開心~~
上代碼
// custom-$message.js
import ElementUI from 'element-ui';
export default {
install(Vue, options) {
Vue.prototype.$message = function(msg, type) {
ElementUI.Message({
message: msg,
duration: 10000,
showClose: true,
type: type
});
};
Vue.prototype.$message.error = function(msg) {
ElementUI.Message({
message: msg,
duration: 10000,
showClose: true,
type: 'error'
});
};
Vue.prototype.$message.warning = function(msg) {
ElementUI.Message({
message: msg,
duration: 10000,
showClose: true,
type: 'warning'
});
};
Vue.prototype.$message.success = function(msg) {
ElementUI.Message({
message: msg,
duration: 10000,
showClose: true,
type: 'success'
});
};
Vue.prototype.$message.close = function() {
return ElementUI.Message.close();
};
Vue.prototype.$message.closeAll = function() {
return ElementUI.Message.closeAll();
};
}
};
然后main.js中引入就行啦
import ElementUI from 'element-ui';
import message from './custom-$message';
.....
Vue.use(ElementUI);
Vue.use(message);
.....
注意：
Vue.use(message)要放在Vue.use(ElementUI)的后面哦吆玖！
以上！
