dimmer

 

elementui使用MessageBox 弹框自定义内容$msgbox:实现一个textarea文本输入框

onComment: function () {
    var _this = this;
    const h = _this.$createElement;
    _this.$msgbox({
        title: '消息',
        message: h('div', {
            attrs: {
                class: 'el-textarea',
            },
        }, [
            h('textarea', {
                attrs: {
                    class: 'el-textarea__inner',
                    autocomplete: 'off',
                    rows: 4,
                    id:'commentContent'
                },
                value: _this.commentContent,
                on: { input: _this.onCommentInputChange }
            })
        ]),
        showCancelButton: true,
        confirmButtonText: '评论',
        cancelButtonText: '取消',
        beforeClose: (action, instance, done) => {
            if (action === 'confirm') {
                instance.confirmButtonLoading = true;
                instance.confirmButtonText = '评论中...';
                alert(_this.commentContent);
            } else {
                done();
            }
        }
    }).then(action => {
        _this.$message({
            type: 'info',
            message: 'action: ' + action
        });
    });
},
onCommentInputChange() {
    this.commentContent = document.getElementById("commentContent").value;
}

posted on 2021-06-10 14:41  布灵的大乔  阅读(1414)  评论(0编辑  收藏  举报

导航