@xwink/ui

Dialog

声明式对话框。焦点陷阱、Esc / 点遮罩关闭、滚动锁、aria 关联全部交给 Reka UI——手写的 fixed inset-0 弹层这些一个都没有,键盘用户会直接卡在背景内容里。

「先斩后奏」的中断确认用命令式 confirm / alert / prompt,见模式 → 命令式对话框

声明式用法

声明式 XDialog

命令式 API

createDialogApi / useDialog 提供 confirm / alert / prompt,动态挂载、决策后自毁,模板里不用预留任何标签。在 Reka 的 AlertDialog 之上:点遮罩不关闭(「必须做出选择」的中断语义)。

ts
const dialog = useDialog()
const ok = await dialog.confirm({ message: '删除后不可恢复', variant: 'danger' })

API

Props

名称类型默认值说明
titlestring | undefinedundefined
descriptionstring | undefinedundefined补充说明,同时作为 aria-describedby 的内容
hideCloseboolean | undefinedfalse关掉右上角关闭按钮(例如必须做出选择的场景)
openboolean | undefinedfalse

Emits

事件载荷说明
update:open[value: boolean]

Slots

插槽说明
default
footer