elementPlus消息组件多按钮案例

javascript 复制代码
let customClass = 'zsl-el-message-box'
efb.messageBox({
    title: '操作提示',
    showConfirmButton: false,
    customClass,
    message: efb.VNode('div', null, [
        efb.VNode('style', null, `.${customClass} .el-message-box__message {width: 100%;}`),
        efb.VNode('div', null, 'hello world'),
        efb.VNode('div', {
            class: 'el-message-box__btns',
        }, [
            efb.VNode('button', {
                class: 'el-button el-button--primary',
                onClick(event) {
                    event.target.closest('.el-message-box').querySelector('.el-message-box__btns button[aria-disabled=false]').click();
                    console.log('确认', event)
                 }
            }, '确定'),
            efb.VNode('button', {
                class: 'el-button el-button--success',
                onClick(event) {
                    event.target.closest('.el-message-box').querySelector('.el-message-box__btns button[aria-disabled=false]').click();
                    console.log('按钮2', event)
                 }
            }, '按钮2'),
            efb.VNode('button', {
                class: 'el-button',
                onClick() {
                    event.target.closest('.el-message-box').querySelector('.el-message-box__close').click();
                    console.log('取消', event)
                }
            }, '取消')
        ])
    ]),
}).then( (result) => {
    console.log(result, 'then')
}
).catch( () => {})
相关推荐
Q_Q1963288475几秒前
python+vue的在线租房 房屋租赁系统
开发语言·vue.js·spring boot·python·django·flask·node.js
不如喫茶去9 分钟前
VUE查询-历史记录功能
前端·javascript·vue.js
持梦远方14 分钟前
重生之我拿捏Linux——《三、shell脚本使用》
前端·chrome
行走在顶尖22 分钟前
代码截断运行逻辑
前端
武天28 分钟前
说说你对slot的理解?slot使用场景有哪些?
vue.js
一枚前端小能手28 分钟前
「周更第8期」实用JS库推荐:decimal.j
前端·javascript
草莓熊Lotso29 分钟前
《C++ Web 自动化测试实战:常用函数全解析与场景化应用指南》
前端·c++·python·dubbo
武天32 分钟前
vue中,key的原理
vue.js
武天36 分钟前
如何打破scope对样式隔离的限制?
vue.js
武天37 分钟前
Vue中的$nextTick有什么作用?
vue.js