简介
validate-js 是一个用于在前端验证表单数据的 JavaScript 库。它可以帮助开发者轻松地实现表单验证，并提供了丰富的验证规则。
安装
你可以通过npm安装 validate-js:
npm install validate-js
或者，你也可以将以下代码添加到html中引用：
<script src="https://unpkg.com/validate-js@0.13.1/dist/validate.min.js"></script>
注意：这里引入的是版本号为
0.13.1的validate.min.js。如果你需要其他版本，你可以到 GitHub Release 页面查看并下载。
基本使用
HTML
开始之前，我们需要定义一个HTML表单，如下所示：
-- -------------------- ---- ------- ----- ---------- ------------- ------------ ------ -------------------------- ------ ----------- ------------ ----------- ------ -------------------------------- ------ --------------- --------------- -------------- ------- ----------------------------- -------
JavaScript
接下来，我们需要在JavaScript中引用 validate-js 并创建验证规则。例如，定义一个简单的规则来验证邮箱和密码是否为空：
-- -------------------- ---- -------
----- ----------- - -
------ -
--------- -----
------ ----
--
--------- -
--------- -----
------- -
-------- --
-------- ----- -- -- ----- - -----------
-
-
--然后，我们可以使用 validate 函数来验证表单数据：
-- -------------------- ---- -------
----- ---- - ----------------------------------
------------------------------- ------- -- -
-----------------------
----- ------ - -------------- -------------
-- -------- -
-- ------
- ---- -
-- ---------
--------------
-
---当用户点击提交按钮时，将会验证表单数据。如果存在不符合规则的数据，它将返回一个包含错误信息的对象。否则，将会提交表单。
错误处理
如果存在错误，我们可以将其显示在页面上：
-- -------------------- ---- -------
----- ---- - ----------------------------------
----- --------------- - ----------------------------------
------------------------------- ------- -- -
-----------------------
----- ------ - -------------- -------------
-- -------- -
------------------------- - ---
--------------------------------- -- -
--------------------------- -- -
----- -- - -----------------------------
-------------- - ------- ----------
--------------------------------
---
---
- ---- -
--------------
-
---高级用法
自定义规则
为了满足项目中的需要，我们可能需要自定义一些规则。例如，我们需要验证两个密码是否相同：
validate.validators.confirmation = function(value, options, key, attributes) {
if (value !== attributes[options.attribute]) {
return options.message || "doesn't match confirmation";
}
};使用自定义规则：
-- -------------------- ---- -------
----- ----------- - -
--------- -
--------- -----
------- -
-------- --
-------- ----- -- -- ----- - -----------
-
--
------------- -
--------- -----
------------- - ---------- ---------- -
-
--异步验证
有时，我们需要异步地验证表单数据。例如，当用户输入用户名时，我们需要检查该用户名是否已经被注册。在这种情况下，validate-js 提供了一个 async 函数。
首先，我们需要定义一个异步规则来检查用户名是否可用：
-- -------------------- ---- -------
------------------------------------- - ----- --------------- -
----- -------- - ----- -----------------------------------------------------------------------
-- ---------------- --- ---- -
----- --- -------------- ------- -------------------------
-
----- ---- - ----- ----------------
-- -----------------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------