zoukankan      html  css  js  c++  java
  • 使用 element 的 msgbox 自定义弹出内容

    如图:

    1、npm 安装:npm i element-ui -S

    2、热点点击事件:

    // 创建新节点
    const
    h = this.$createElement; this.$msgbox({
      // 创建div span 节点 message: h(
    'div', { class: 'hot_msgbox' }, [ h('span', null, this.$t('Finance.DouWantTo') + '" '), h('span', { style: 'color: #2FA8E8' }, row.memberName), h('span', null, ' "' + this.$t('Finance.AddAsAhotAccount')) ]), showCancelButton: true, // 按钮显示 cancelButtonText: '否,继续操作', // 自定义按钮 confirmButtonText: '是,设为热点用户', // 自定义按钮 }).then(({}) => { this.$message({ type: 'success', message: '添加成功' }); }).catch(() => { });

    3、按钮样式:

    <style>
        .el-message-box__btns{
            padding: 5px 25px 15px;
        }
        .el-message-box__btns .el-button{
            background: #a5a5a5;
            color: #fff;
            border: 1px solid #a5a5a5;
        }
        .el-message-box__btns .el-button.el-button--primary{
            background: #2FA8E8;
            border: 1px solid #2FA8E8;
        }
        .el-message-box__btns .el-button.el-button--small{
            padding: 10px 15px;
        }
    </style>

    注:style 不可添加 scoped ,否则样式无效

  • 相关阅读:
    centos6升级内核
    centos7启动盘制作
    sed匹配字符串并将匹配行的后几行注释
    cmd下调用xshell登录linux服务器
    centos清除历史命令
    yum错误Cannot retrieve metalink for repository: epel/x86_6
    ansible-playbook
    jdk升级到1.8
    shell瞎记录
    shell 循环
  • 原文地址:https://www.cnblogs.com/moguzi12345/p/14541604.html
Copyright © 2011-2022 走看看