vue中全局修改elementui,message修改时长

有几种不同的写法对应不同的修改方式,都写在main.js里

第一种

bash 复制代码
// this.$message.success('添加成功')

['success', 'warning', 'info', 'error'].forEach(type => {
    ElementUI.Message[type] = options => {
        if (typeof options === 'string') {
            options = {
                message: options
            };
            options.duration = 800
            // if (type == 'warning' || type == 'error') {
            //     options.showClose = true
            // }
        }
        options.type = type;
        return ElementUI.Message(options);
    };
});

第二种

bash 复制代码
// this.$message({
//     message: '添加成功',
//     type: 'success'
// });
Vue.prototype.$message = function(msg){
    //根据msg对象中的type类型判断消息提示的类型
    let msgObj = {
      message:msg.message?msg.message:msg,
      duration: 800
    }
    let msgType = msg.type || ""
    switch(msgType) {
      case 'success':
        return  ElementUI.Message.success(msgObj);
      case 'warning':
        return  ElementUI.Message.warning(msgObj);
      case 'error':
        return  ElementUI.Message.error(msgObj);
      default:
        return  ElementUI.Message(msgObj);
    }
  }

第三种

bash 复制代码
// this.$message1( "添加成功" ,"success");
Vue.prototype.$message1 = function(msg, msgBg) {
    return ElementUI.Message({
        message: msg,
        duration: 800,
        type: msgBg,
        // showClose:true
    })
};
相关推荐
秦jh_8 分钟前
【Linux】多线程(概念,控制)
linux·运维·前端
蜗牛快跑21321 分钟前
面向对象编程 vs 函数式编程
前端·函数式编程·面向对象编程
Dread_lxy22 分钟前
vue 依赖注入(Provide、Inject )和混入(mixins)
前端·javascript·vue.js
涔溪1 小时前
Ecmascript(ES)标准
前端·elasticsearch·ecmascript
榴莲千丞1 小时前
第8章利用CSS制作导航菜单
前端·css
奔跑草-1 小时前
【前端】深入浅出 - TypeScript 的详细讲解
前端·javascript·react.js·typescript
羡与2 小时前
echarts-gl 3D柱状图配置
前端·javascript·echarts
guokanglun2 小时前
CSS样式实现3D效果
前端·css·3d
咔咔库奇2 小时前
ES6进阶知识一
前端·ecmascript·es6
渗透测试老鸟-九青2 小时前
通过投毒Bingbot索引挖掘必应中的存储型XSS
服务器·前端·javascript·安全·web安全·缓存·xss