Tui

0.7.2
MessageBox 消息弹窗
基于 TsModal 封装的函数式弹窗能力，提供 alert / confirm / prompt 三种常见交互模式。
适用于二次确认、输入确认、提示确认等场景。
alert 基础提示
最简单的提示弹窗，适合只需要确认已读的场景。
示例代码
vue
confirm 二次确认
用于删除、重置等高风险操作的确认场景。
示例代码
vue
prompt 输入确认
支持输入值、必填校验和自定义校验函数。
示例代码
vue
高级配置
演示宽度、按钮文案、beforeClose 等高级能力。
示例代码
vue
参数 MessageBoxOptions
属性名
说明
类型
可选值
默认值
版本说明
type
弹窗类型
'alert' | 'confirm' | 'prompt'
alert / confirm / prompt
alert
title
标题
string
提示
message
正文内容
string
width
弹窗宽度
string
420px
padding
内容内边距，和 TsModal 的 padding 定义一致
number | string | boolean | null
16
showClose
是否展示右上角关闭按钮
boolean
true
maskClosable
是否允许点击遮罩关闭
boolean
false
beforeClose
关闭前拦截回调
(ctx) => boolean | Promise<boolean>
showCancelButton
是否展示取消按钮
boolean
confirm/prompt 为 true
confirmButtonText
确认按钮文本
string
确定（alert 默认我知道了）
cancelButtonText
取消按钮文本
string
取消
confirmButtonType
确认按钮类型
'primary' | 'danger' | ...
primary
inputValue
prompt 模式默认输入值
string
inputPlaceholder
prompt 输入框占位文本
string
请输入内容
inputRequired
prompt 是否必填
boolean
false
inputValidator
prompt 输入校验函数
(value) => boolean | string | Promise<boolean | string>
方法 Methods
方法名
说明
参数
返回值
版本说明
TsMessageBox(options)
通用调用入口
(options: MessageBoxOptions)
Promise<MessageBoxResult>
TsMessageBox.alert(message, title?, options?)
提示弹窗
(message: string, title?: string, options?)
Promise<MessageBoxResult>
TsMessageBox.confirm(message, title?, options?)
确认弹窗
(message: string, title?: string, options?)
Promise<MessageBoxResult>
TsMessageBox.prompt(message, title?, options?)
输入弹窗
(message: string, title?: string, options?)
Promise<MessageBoxResult>
TsMessageBox.closeAll()
关闭所有 MessageBox
()
void
alert 基础提示
confirm 二次确认
prompt 输入确认
高级配置
参数 MessageBoxOptions
方法 Methods