elementUI中messageBox自定义展示内容

前提：使用了elementui中提交内容的MessageBox弹窗，但需要在弹窗上加上一个记住邮箱的元素，且需要与后台对接

原来代码如下：

this.$prompt('请输入邮箱', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
          inputErrorMessage: '邮箱格式不正确'
        }).then(({ value }) => {
          this.$message({
            type: 'success',
            message: '你的邮箱是: ' + value
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          });       
        });

拿到需求时我都不知道要怎么插元素进去，看了文档可以在message属性定义，于是就看了一些帖子，get到了新知识

代码如下：

    downloadFile(file, event) {
      console.log(file, event);
      const h = this.$createElement;
      var that = this
      event.stopPropagation();//阻止事件冒泡
      this.$prompt("", "提示", {
        message: h("p", null, [
          h("span", null, "请输入接收文件邮箱 "),
          h(
            "el-checkbox",
            { style: "width:5rem", on: { change: that.getCheck } },
            "记住邮箱"
          ),
        ]),
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        inputPattern:
          /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
        inputErrorMessage: "邮箱格式不正确",
      })
        .then(({ value }) => {
          this.$message({
            type: "success",
            message: "文件正快马加鞭到您的邮箱，预计1~3分钟内抵达",
          });
        })
        .catch(() => {});
    },
    getCheck(val) {
      this.isCkeckEmail = val;
    },

效果如图：