简介
@pile-ui/validator 是一个基于 validator.js 的表单验证工具包，专门为前端开发人员设计，可以轻松地进行表单验证，节省时间和精力。
安装
使用 npm 安装 @pile-ui/validator：
npm install @pile-ui/validator
使用
引入
import Validator from '@pile-ui/validator';
API
@pile-ui/validator 提供了一系列 API 用于表单验证：
validate(rules, values[, messages])
-- -------------------- ---- ------- --- - -------- - - ------ -------- ----- - ---- - ------ -------- ------ - ------- - ------ -------- ---------- - ------ - -------- -------- - ------------------ -- ------------------------- ------- ----------
rules- 表单验证规则。values- 要验证的表单数据。messages- 验证错误消息。
-- -------------------- ---- -------
------ --------- ---- ---------------------
----- ----- - -
----- -
--------- -----
----- ---------
---------- --
---------- ---
--
------ -
--------- -----
----- --------
--
---- -
--------- -----
----- ---------
---- --
---- ----
--
--
----- ------ - -
----- ---
------ ---
---- ---
--
----- -------- - -
---------------- --------
------------ ---------
----------------- --------- ---
----------------- --------- ----
----------------- --------
------------- ---------
--------------- --------
----------- ---------
---------- ------- ---
---------- ------- -----
--
----- ------ - ------------------------- ------- ----------
--------------------addMethod(name, fn)
/**
* 添加自定义验证规则方法
*
* @param {String} name - 自定义验证规则方法名
* @param {Function} fn - 自定义验证规则方法函数
*/
Validator.addMethod(name, fn);name- 自定义的验证规则方法名。fn- 自定义的验证规则方法函数。
-- -------------------- ---- -------
------ --------- ---- ---------------------
------------------------------ ------- ------ -- -
------ ----- --- ------
---
----- ----- - -
--------- -
--------- -----
--
---------------- -
--------- -----
-------- ------------
--
--
----- ------ - -
--------- ---------
---------------- ---------
--
----- -------- - -
-------------------- --------
--------------------------- ----------
-------------------------- -------------
--
----- ------ - ------------------------- ------- ----------
--------------------defaultMessage
@pile-ui/validator 提供了一些默认的错误消息，可以通过覆盖这些错误消息，来自定义验证错误消息，这些默认的错误消息如下所示：
-- -------------------- ---- ------- - --------- ---------- ------ --------- ---- ---- -------- ------- ---------- -------- ---------- ------ ----------- ------------- -------------- ----- -------------------- ---------- --------- ------------- ---------- --------- ------------- ---- ------- ------- ---- ------- ------- -------- --------- -------- --------- -
可以通过以下方式覆盖默认消息：
import Validator from '@pile-ui/validator'; Validator.defaultMessage.required = '请填写此字段'; Validator.defaultMessage.email = '请填写正确的邮箱地址';
示例
-- -------------------- ---- -------
------ --------- ---- ---------------------
------------------------------ ------- ------ -- -
------ ----- --- ------
---
--------------------------------- - ---------
------------------------------ - -------------
----- ----- - -
----- -
--------- -----
----- ---------
---------- --
---------- ---
--
------ -
--------- -----
----- --------
--
--------- -
--------- -----
---------- --
--
---------------- -
--------- -----
-------- ------------
--
--
----- ------ - -
----- ---
------ ---
--------- ---
---------------- ---
--
----- ------ - ------------------------- --------
--------------------结语
@pile-ui/validator 是一个非常实用的表单验证工具包，可以大大地提高前端开发人员的开发效率，希望开发人员可以善加利用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600672683660cf7123b36698