prompt

prompt 函数是对 <mdui-dialog> 组件的封装，该函数在功能上用于代替系统原生的 window.prompt 函数。使用该函数，你无需编写组件的 HTML 代码，就能打开一个可输入文本的对话框。

使用方法

按需导入函数：

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

使用示例：

open

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

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

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

  button.addEventListener("click", () => {
    prompt({
      headline: "Prompt Title",
      description: "Prompt description",
      confirmText: "OK",
      cancelText: "Cancel",
      onConfirm: (value) => console.log("confirmed: " + value),
      onCancel: () => console.log("canceled"),
    });
  });
</script>

API

prompt(options: Options): Promise<string>

函数的参数为 Options 对象；返回值为 Promise，如果是通过点击确定按钮关闭对话框，则 Promise 会被 resolve，resolve 的参数为输入框的值，如果是通过其他方式关闭对话框，则 Promise 会被 reject。

Options

属性名	类型	默认值
`headline`	`string`	-
prompt 的标题
`description`	`string`	-
prompt 的描述文本
`icon`	`string`	-
prompt 顶部的 Material Icons 图标名
`closeOnEsc`	`boolean`	`false`
是否在按下 ESC 键时，关闭 prompt
`closeOnOverlayClick`	`boolean`	`false`
是否在点击遮罩层时，关闭 prompt
`confirmText`	`string`	`OK`
确认按钮的文本
`cancelText`	`string`	`Cancel`
取消按钮的文本
`stackedActions`	`boolean`	`false`
是否垂直排列底部操作按钮
`queue`	`string`	-
队列名称。默认不启用队列，在多次调用该函数时，将同时显示多个 prompt。可在该参数中传入一个队列名称，具有相同队列名称的 prompt 函数，将在上一个 prompt 关闭后才打开下一个 prompt。 `dialog()`、`alert()`、`confirm()`、`prompt()` 这四个函数的队列名称若相同，则也将互相共用同一个队列。
`onConfirm`	`(value: string, dialog: Dialog) => void \| boolean \| Promise<void>`	-
点击确认按钮时的回调函数。函数参数为输入框的值和 dialog 实例，`this` 指向 dialog 实例。默认点击确认按钮后会关闭 prompt；若返回值为 `false`，则不关闭 prompt；若返回值为 promise，则将在 promise 被 resolve 后，关闭 prompt。
`onCancel`	`(value: string, dialog: Dialog) => void \| boolean \| Promise<void>`	-
点击取消按钮时的回调函数。函数参数为输入框的值和 dialog 实例，`this` 指向 dialog 实例。默认点击取消按钮后会关闭 prompt；若返回值为 `false`，则不关闭 prompt；若返回值为 promise，则将在 promise 被 resolve 后，关闭 prompt。
`onOpen`	`(dialog: Dialog) => void`	-
prompt 开始打开时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onOpened`	`(dialog: Dialog) => void`	-
prompt 打开动画完成时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onClose`	`(dialog: Dialog) => void`	-
prompt 开始关闭时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onClosed`	`(dialog: Dialog) => void`	-
prompt 关闭动画完成时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`onOverlayClick`	`(dialog: Dialog) => void`	-
点击遮罩层时的回调函数。函数参数为 dialog 实例，`this` 也指向 dialog 实例。
`validator`	`(value: string) => boolean \| string \| Promise<void>`	-
输入框的验证函数，参数为输入框的值。`this` 指向 TextField 实例。将在浏览器原生验证 API 验证通过后，再使用该函数进行验证。可以返回 `boolean` 值，为 `false` 时表示验证未通过，为 `true` 时表示验证通过。也可以返回字符串，字符串不为空时表示验证未通过，同时返回的字符串将用作错误提示。也可以返回 Promise，被 resolve 表示验证通过，被 reject 表示验证未通过，同时拒绝原因将用作错误提示。
`textFieldOptions`	`Partial<TextField>`	-
prompt 内部的输入框为 `<mdui-text-field>` 组件。可在该参数中设置 `<mdui-text-field>` 组件的参数。

confirm

snackbar