介绍
在web开发中，弹窗提示是非常常见的一个需求。而 alertify.js 是一个轻量级的弹窗提示库，它不仅具有灵活的配置选项和丰富的 API，还提供了丰富的主题，可以满足各种不同的需求。
在本文中，我们将介绍如何使用 alertify.js，并提供详细的学习和指导意义，并包含使用示例代码。
安装
alertify.js 可以通过正常的 npm 方式进行安装：
npm install alertify.js-rl
使用
引入 alertify.js
alertify.js 提供了两种使用方式：一种是直接引入其 JavaScript 文件，另一种是通过 npm 包引入。在这里，我们介绍通过 npm 包引入 alertify.js 的方式。
引入 alertify.js 的最简方式是：
import alertify from 'alertify.js-rl';
弹窗提示
一个基本的弹窗提示可以使用以下代码来创建：
alertify.alert('Alert Message');上述代码将弹出一个包含 Alert Message 文本的提示框。
确认框
有时候我们需要确认用户是否确定执行某个操作，这时候我们可以使用 alertify 的 confirm 方法：
alertify.confirm('Confirmation Message', function() {
console.log('OK');
}, function() {
console.log('Cancel');
});上述代码将弹出一个包含 Confirmation Message 文本和两个确认和取消按钮的提示框。当用户点击确认按钮时，将会执行第一个回调函数；当用户点击取消按钮时，将会执行第二个回调函数。
提示框
alertify 还提供了一种可以自动关闭的提示框，可以使用以下代码：
alertify.log('Log Message', 'success', 5000);上述代码将弹出一个包含 Log Message 文本和一个绿色的成功图标的提示框，并在 5 秒后自动关闭。
弹窗选项
在使用 alertify 时，我们可以自定义弹窗的各种选项：
alertify.alert('Message', function() {
console.log('OK');
}).set('title', 'My Title').set('modal', true).set('closable', false);上述代码设置了弹窗的标题为 My Title，并且将其设置为模态框，并禁止了弹窗的关闭按钮。
自定义主题
alertify 提供了多种不同的主题，您可以根据自己的需求选择自定义主题。可以使用以下代码设置主题：
alertify.set('theme', 'bootstrap');国际化
alertify 支持多种不同的语言，您可以根据自己的需求选择合适的语言。可以使用以下代码设置语言：
alertify.set('locale', 'zh_CN');综合示例
下面是一个 alertify 简单示例，该示例展示了基本提示框和确认框的使用方式：
-- -------------------- ---- -------
--------- -----
------
------
--------------- ---------------
----- ---------------- ------------------------------------------------------------------------------- --
-------
------
------------ ------------
------- -----------------------------
------- ---------------------------------
------- --------------------------------------------------------------------------------------
--------
-------------------------------------------------------------- ---------- -
-------------------- -- -- ----- ----------
---
---------------------------------------------------------------- ---------- -
--------------------- --- ---- --- ---- -- ------ ---- ------- ---------- -
------------------- -------------
-- ---------- -
------------------- -------------
---
---
---------
-------
-------总结
在本文中，我们介绍了如何使用 alertify.js，包括安装、基本用法、弹窗选项、自定义主题和国际化等等。alertify.js 不仅轻量级而且具有灵活的配置选项和丰富的 API，可以满足各种不同的需求。我们希望这篇文章能够帮助您更好地使用 alertify.js，并提供了对于其他弹窗提示库的思考参考。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600574e781e8991b448ea304