本文共 1675 字，大约阅读时间需要 5 分钟。

正常的情况的展示：

<template>  <el-button type="text" @click="open">点击打开 Message Box</el-button></template><script>  export default {       methods: {         open() {           this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {             confirmButtonText: '确定',          cancelButtonText: '取消',          type: 'warning'        }).then(() => {             this.$message({               type: 'success',            message: '删除成功!'          });        }).catch(() => {             this.$message({               type: 'info',            message: '已取消删除'          });                  });      }    }  }</script>

主要的拓展为：信息内容

针对这种需要多行的内容，就需要拓展写法

const h = this.$createElement          this.$msgbox({                   title: '提示',                message: h('p', {    style: 'color: black' }, [                  h('div', {    style: 'color: black' }, '删除后将无法恢复，确认删除吗？'),                  h('div', {    style: 'color: gray' }, '注：删除该知识库种类将一同删除其下所有内容')        ]),                showCancelButton: true,                confirmButtonText: '确定',                cancelButtonText: '取消',                type: 'warning'          }).then(() => {                   this.$message({                     type: 'success',                  message: '删除成功!'                })          }).catch(() => {                   this.$message({                     type: 'info',                  message: '已取消删除'            })      })

主要代码为：

  message: h('p', {    style: 'color: black' }, [                     h('div', {    style: 'color: black' }, '删除后将无法恢复，确认删除吗？'),                     h('div', {    style: 'color: gray' }, '注：删除该知识库种类将一同删除其下所有内容')        ])

在这里h需要提前定义，第一位为标签名字，第二位为样式，之后的内容用数组[]包起来，如此就实现了，内容的自定义。