為什么頭頂越來(lái)越禿？

還不是因?yàn)榭蛻舻囊笤絹?lái)越多！

一個(gè)快完成的項(xiàng)目

要求所有的提示框消失時(shí)間延長(zhǎng)，并且可以手動(dòng)關(guān)閉

這并沒(méi)有什么

但是100、200個(gè)文件里都用到$message

一個(gè)一個(gè)改要哭哦

但是！

看了Element 文檔發(fā)現(xiàn)，Element 已經(jīng)為 Vue.prototype 添加了全局方法 $message，我們只需要全局重寫 $message 即可

簡(jiǎn)直不要太開心~~

上代碼

// 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)的后面哦！

以上！