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
    })
};
相关推荐
devincob5 小时前
js原生、vue导出、react导出、axios ( post请求方式)跨平台导出下载四种方式的demo
javascript·vue.js·react.js
编程社区管理员5 小时前
React 发送短信验证码和验证码校验功能组件
前端·javascript·react.js
全马必破三5 小时前
React“组件即函数”
前端·javascript·react.js
三思而后行,慎承诺5 小时前
React 底层原理
前端·react.js·前端框架
座山雕~5 小时前
html 和css基础常用的标签和样式
前端·css·html
灰小猿6 小时前
Spring前后端分离项目时间格式转换问题全局配置解决
java·前端·后端·spring·spring cloud
im_AMBER7 小时前
React 16
前端·笔记·学习·react.js·前端框架
02苏_7 小时前
ES6模板字符串
前端·ecmascript·es6
excel7 小时前
⚙️ 一次性警告机制的实现:warnOnce 源码深度解析
前端
excel7 小时前
Vue SFC 样式编译核心机制详解:compileStyle 与 PostCSS 管线设计
前端