bootbox.js 是一个基于 Bootstrap 模态框的 JavaScript 插件，可以快速创建美观的对话框和提示框。本文将介绍如何使用 npm 包安装和使用 bootbox.js。
1. 安装 npm 包
在项目目录下打开终端，输入以下命令安装 bootbox.js：
npm install bootbox --save
这将会将 bootbox.js 包以及其所有依赖项安装到您的项目中，并将其添加到 package.json 文件中。
2. 引入 bootbox.js
您可以使用 CommonJS 或 ES6 的模块语法来引入 bootbox.js。以下是两种常见方式：
CommonJS (Node.js)
const bootbox = require('bootbox');ES6
import bootbox from 'bootbox';
3. 创建对话框
调用 bootbox.dialog() 函数可以创建一个弹出式对话框。以下是一个简单的示例代码：
-- -------------------- ---- -------
----------------
------ ----------
-------- ------- --------
-------- -
--- -
------ -----
---------- -------------
-
-
---这里我们创建了一个标题为"Welcome"的对话框，内容为"Hello, world!"，并添加了一个标签为"OK"的按钮。按钮的样式通过 className 属性设置为'btn-primary'。
4. 创建提示框
bootbox.alert() 函数可以创建一个简单的提示框，用于显示一条消息并等待用户响应。以下是示例代码：
bootbox.alert({
message: 'This is an alert!'
});这里我们创建了一个带有消息"This is an alert!"的提示框。
5. 创建确认对话框
bootbox.confirm() 函数可以创建一个确认对话框，用于让用户选择"确定"或"取消"。以下是示例代码：
-- -------------------- ---- -------
-----------------
-------- ---- --- -------
-------- -
-------- -
------ ------
---------- -------------
--
------- -
------ -----
---------- ---------------
-
--
--------- ---------------- -
-------------------- - - --------
-
---这里我们创建了一个包含消息"Are you sure?"的确认对话框，并添加了标签为"Yes"和"No"的两个按钮。当用户点击任意一个按钮时，将调用回调函数并传递 true 或 false 作为参数。在本例中，回调函数仅仅将结果输出到控制台上。
6. 总结
通过使用 npm 包安装 bootbox.js，您可以方便地创建美观的对话框和提示框。本文介绍了如何创建对话框、提示框和确认对话框，并提供了相关示例代码。希望这篇文章能够给您带来帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/33043
