自定义Mint UI Massage Box 内容框内样式

2019-07-17  本文已影响0人  IvyAutumn

massage box默认样式如下


image.png

有时户需要修改massage box提示框中文字的格式,希望能够像写html一样去定义
示例

    checkChange(){
      if(!this.checked){
        // MessageBox('提示', 'checked');
        const html = `
        <div class="card">
            <ul class="checkedList">
                <li class="pb45">
                    <span class="color-red">请您谨慎操作。</span>
                </li>
                <li class="pb45">
                    <span>您正在关闭该功能。</span>
                </li >
                <li class="pb45">
                    <span>该功能关闭后,如需再次开通,您需要您联系管理员为您打开。</span>
                </li>
            </ul>
        </div>
              `

        MessageBox.confirm(html).then(action => { 
           if (action == 'confirm') {     //确认的回调
            this.checked = false;
            }
           }).catch(err => { 
           if (err == 'cancel') {     //取消的回调
            this.checked = true;
            } 
           });
      }else{
        // console.log(this.checked)
        // MessageBox('提示', '去设置');     
      }
    },
上一篇下一篇

猜你喜欢

热点阅读