Vue-dullahan-validation 是一款基于 Vue.js 框架的表单验证插件，它提供了便捷易用的表单验证方法，能够对表单数据进行快速可靠的验证。本文将会介绍 vue-dullahan-validation 的使用教程以及一些实用的示例代码。
安装
Vue-dullahan-validation 可以通过 npm 安装，使用以下命令：
--- ------- ----------------------- ------
使用
引入包文件：
------ --- ---- ------ ------ ------------ ---- -------------------------- ----------------------
API
Vue-dullahan-validation 提供了以下方法：
validate
验证表单项，返回验证结果。validate 接受三个参数：
fieldName，用于验证的字段名称；value，验证的值；validators，一个数组，包含待验证的验证器。
------ - --------- - ---- -------------------------- -------------------------- ----- -- --------- ----- -------- ------- ----
validate 返回一个对象。
valid属性为一个布尔值，表示该字段是否通过验证；errors属性为一个数组，包含错误信息。
addValidator
添加验证器，添加之后可以通过 validate 方法进行验证。addValidator 接受两个参数：
validatorName，验证器名称；validatorFunc，验证器方法。
------ - --------- - ---- -------------------------- ------------------------------- ----- -- - -- -- ----- ---- ------ ----------------------------------------- --- --------------------------- --------------------- -- ------ ---- ----
addMessage
添加验证器错误提示信息，用于支持自定义验证器的提示信息。addMessage 接受两个参数：
validatorName，验证器名称；message，对应的错误信息。
------ - --------- - ---- -------------------------- ----------------------------- ---------------- --------------------------- --------------------- -- ------ ---- ----
setLanguage
设置错误提示语言，设置后将会影响到所有使用 Vue-dullahan-validation 的组件。
------ - --------- - ---- -------------------------- ----------------------- --- - --------- ------ - --- -- -- --------------------- - --------- - --- - --------- ------ - - ---
setCustomConfig
设置自定义配置，比如错误提示信息的容器节点。
------ - --------- - ---- -------------------------- --------------------------- --------- ----------- --- -- -- --------------------- - ------------- - --------- ----------- - ---
示例
常规验证
----------
-----
------ ----------- -------------- --
---- -------------------- ----------- --------
------- ------------- ---------------------------
------
-----------
--------
------ - --------- - ---- --------------------------
------ ------- -
------ -
------ -
----- ---
------- ---
--
--
-------- -
-------- -
----- ------ - -------------------------- ---------- -- --------- ----- -------- ------- ----
---------------- - ------------ - -- - -----------------
--
--
--
---------联动验证
----------
-----
------ ------------- ------------- --
---- -------------------- ---------- --------
------ ----------- ------------ --
---- -------------------- --------- --------
------- ------------- ---------------------------- ---------------------------
------
-----------
--------
------ - --------- - ---- --------------------------
------ ------- -
------ -
------ -
---- ---
--- ---
------- ---
--
--
--------- -
-- ----------
----------------- -
----- --------- - ------------------------- --------- -- --------- ----- -------- ------- -- - ---- --- -------- ------- -- -- ----
----- -------- - ------------------------ -------- -- --------- ----- -------- -------- -- - --- ----- -------- ---------- ----
--------------- - --------------- - -- - --------------------
-------------- - -------------- - -- - -------------------
------ --------------- -- ---------------
--
--
-------- -
-------- -
-- ----
--
--
--
---------自定义验证器
------ - --------- - ---- -------------------------- -- ----- --------------------------- -- ----- -- -- ----------- -- ----------- -- --------- -- ------------------------------------- ------------------------------------ ----- -- - ------ ----------------------------------------------------------------------------------------------- --- ---------------------------------- ------------------------------------- ---- -- ------ ------------------------------ ---------- -- ----------- ---- ----
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005754181e8991b448ea4bb