alert

alert 函数是对 <mdui-dialog> 组件的封装，该函数用于代替系统原生的 window.alert 函数。使用该函数，你无需编写组件的 HTML 代码，就能打开一个警告框。

使用方法

按需导入函数：

import { alert } from 'mdui/functions/alert.js';

使用示例：

open

<mdui-button class="example-button">open</mdui-button>

<script type="module">
  import { alert } from "mdui/functions/alert.js";

  const button = document.querySelector(".example-button");

  button.addEventListener("click", () => {
    alert({
      headline: "Alert Title",
      description: "Alert description",
      confirmText: "OK",
      onConfirm: () => console.log("confirmed"),
    });
  });
</script>

API

alert(options: Options): Promise<void>

alert 函数接收一个 Options 对象作为参数；返回值为 Promise，如果警告框是通过点击确定按钮关闭的，则 Promise 会被 resolve，如果警告框是通过其他方式关闭的，则 Promise 会被 reject。

Options

属性名	类型	默认值
`headline`	`string`	-
alert 的标题
`description`	`string`	-
alert 的描述文本
`icon`	`string`	-
alert 顶部的 Material Icons 图标名
`closeOnEsc`	`boolean`	`false`
是否在按下 ESC 键时，关闭 alert
`closeOnOverlayClick`	`boolean`	`false`
是否在点击遮罩层时，关闭 alert
`confirmText`	`string`	`OK`
确认按钮的文本
`queue`	`string`	-
队列名称。默认不启用队列，在多次调用该函数时，将同时显示多个 alert。可在该参数中传入一个队列名称，具有相同队列名称的 alert 函数，将在上一个 alert 关闭后才打开下一个 alert。 `dialog()`、`alert()`、`confirm()`、`prompt()` 这四个函数的队列名称若相同，则也将互相共用同一个队列。
`onConfirm`	`(dialog: Dialog) => void \| boolean \| Promise<void>`	-
点击确认按钮时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。默认点击确认按钮后会关闭 alert；若返回值为 `false`，则不关闭 alert；若返回值为 promise，则将在 promise 被 resolve 后，关闭 alert。
`onOpen`	`(dialog: Dialog) => void`	-
alert 开始打开时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onOpened`	`(dialog: Dialog) => void`	-
alert 打开动画完成时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onClose`	`(dialog: Dialog) => void`	-
alert 开始关闭时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onClosed`	`(dialog: Dialog) => void`	-
alert 关闭动画完成时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onOverlayClick`	`(dialog: Dialog) => void`	-
点击遮罩层时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。

dialog

confirm