对话框是一种弹出式 UI 元素，包含页眉、正文和页脚，每个部分都包含特定类型的子组件。对话框还具有实例 API 和多个配置选项，包括针对特定对话框事件的可配置回调函数。

TinyMCE 还支持 URL 对话框。配置 URL 对话框与配置标准的 TinyMCE 对话框不同。

使用场景

显示基本信息

code 插件的对话框是简单对话框的一个示例。它仅包含一个正文面板组件，用于显示内容的 HTML 代码。

源代码

显示复杂信息

更复杂的对话框可以使用 标签页面板 和各种 布局 来分类和组织向用户显示的信息。例如，help 和 字符映射表 插件使用带有标签页面板的对话框来分类和分隔信息。

特殊字符

交互式对话框

TinyMCE 对话框还可以包含 交互式组件，如按钮、复选框和输入字段。

例如，image 插件的对话框允许用户链接或上传图片，输入描述、标题、类、标题、高度和宽度，然后将其插入到编辑器中。

插入/编辑图片

正文组件

对话框的正文必须是 panel（单个面板）或 tabpanel（面板集合）。每个面板可以包含 面板组件，如输入、按钮和文本。

TinyMCE 还支持 URL 对话框。配置 URL 对话框与配置标准的 TinyMCE 对话框有很大不同。

面板

基本的对话框类型是 面板 对话框。面板是 面板组件 的容器。面板类型对话框只有一个面板。

{
  type: 'panel',
  items: [ ... ] // 面板组件数组
}

标签页面板

标签页面板 对话框包含多个面板，并在对话框左侧有一个标签导航菜单，允许在面板之间切换。每个面板可以包含不同的 面板组件，从而实现复杂的对话框。

有关标签页面板配置选项，请参阅 标签页面板组件参考。

{
  type: 'tabpanel',
  tabs: [ // 标签页面板规范数组
    {
      name: 'mytab',
      title: '我的标签',
      items: [ ... ] // 面板组件数组
    },
    ...
  ]
}

面板的 name 可以与 dialogApi.showTab('tabName') 方法一起使用，以编程方式切换标签。它还作为 details 对象的一部分传递给 onTabChange。

标签页面板示例

帮助插件的对话框是标签页面板对话框的一个示例。

帮助按钮