（九）使用SP-Dialog自定义对话框

        在上一篇博客（八）使用SPFx命令集扩展自定义列表操作中我们自定义了两个操作，并部署到SharePoint Online中。当我们点击按钮的时候，会弹出一个对话框：

        这个对话框是使用SPFx提供的SP-Dialog实现的，SP-Dialog是微软提供的一个对话框组件，完全与SharePoint Online集成，在SPFx解决方案中（webpart和extension扩展）可以直接使用，这篇博客将介绍如何使用SP-Dialog对话框组件来自定义一个对话框。

        使用的时候需要使用如下命令在SPFx解决方案中导入SP-Dialog组件：

import { Dialog } from '@microsoft/sp-dialog';

        Dialog是sp-dialog提供的一个开箱即用的静态类，这个类提供了两个常用方法，一个是alert，一个是prompt:

• 弹出一个Alert：Dialog.Alert(message: string, options: IAlertOptions)，其中IAlertOptions允许使用confirmOpen回调函数。
• 弹出一个提示： Dialog.Prompt(message: string, options: IPromptOptions)，其中IPromptOptions中可以定义一个默认。

         除了Dialog类，sp-dialog组件还提供的了对话框基类: BaseDialog，所有的对话框都需要继承这个基类。我们也可以使用这个基类来定义自己的对话框。这个基类提供如下方法：

• onBeforeOpen() ：在打开对话框之前执行的方法
• open() ： 在打开对话框的时候执行的方法
• render() ： 渲染对话框，可以使用DOM元素，也可以使用React组件
• show(option?: IDialogShowOptions) ： 显示对话框
• close() ： 关闭对话框
• onAfterClose()： 在关闭对话框之后执行的方法

        接下来我们看一下如何实现，首先使用Yeoman创建一个命令集扩展的解决方案，名字为spfxDialogDemo。使用Code打开解决方