简介
vz-rn-joi 是一个为 React Native 应用提供数据校验的 npm 包。它基于 joi 数据校验库，提供了一些专门针对 React Native 的校验规则和可定制化的错误提示机制，旨在帮助开发者更方便地进行输入合法性校验。
安装
通过 npm 安装：
npm install vz-rn-joi
如果你使用的是 yarn，也可以通过以下方式安装：
yarn add vz-rn-joi
使用
初始化
在应用入口处，需要首先初始化 joi，例如在 App.js 中：
import Joi from 'joi-browser';
import { initJoi } from 'vz-rn-joi';
import CustomValidators from './CustomValidators';
initJoi(Joi, {
customValidators: CustomValidators
});其中，Joi 是 joi-browser 库的实例，initJoi 的第二个参数可以传递一个可选的配置对象。在本例中，我们传递了一个自定义验证函数的对象 CustomValidators。
定义校验规则
在需要进行校验的组件中，我们可以通过定义一个校验规则对象实例化一个 validator。
-- -------------------- ---- -------
------ ------ - -------- - ---- --------
------ -
-----------
-----
----------
-----------------
----
- ---- ---------------
------ --- ---- --------------
------ - --------- - ---- ------------
----- ----------- - -- -- -
----- ------- --------- - -------------
----- ---------- ------------ - -------------
----- ------- --------- - -------------
-- ------
----- ------ - ------------
------ --------------------------------
--------- ------------------------------
---
----- --------- - --- ------------------
----- ----------- - -- -- -
----- ---------------- - -------------------- ------ -------- ---
-- ------------------------ -
----- -------- - ------------------------------------------
-------------------
-------
-
-------------
-- ------
--
------ -
----- -------------------------
----- ------------------------------
----------
--------------------
-------------
-----------------------
----------------
----------------------------
---------------------
--
----------
--------------------
----------------
--------------------------
----------------
---------------
--
----------------- --------------------- ----------------------
----- -----------------------------------
-------------------
------ --- -- -- ----- ------------------------------------
-------
--
--
----- ------ - -------------------
---------- -
----- --
-------- --
--
------ -
--------- ---
----------- -------
------------- --
--
------ -
--------- ---
------------ --
------------ -------
------------- ---
------------------ ---
------------- --
--
------- -
---------------- ----------
------------- ---
-------- ---
----------- --------
--
----------- -
--------- ---
------ -------
--
------ -
------ ------
---------- --
-
---
------ ------- ------------在上面的示例中，我们首先定义了一个包含 email 和 password 两个字段的校验规则，在 handleLogin 函数中，通过 validator.validate 方法进行校验，并根据返回结果进行处理。
该示例中的校验规则比较简单，但是 joi 提供了非常多的校验方法，建议在编写校验规则时充分利用 joi 内置的校验方法，避免“重复造轮子”。
同时，我们可以通过调用 validator.update 方法更新校验规则，例如添加或删除某些校验规则，这样可以动态改变输入框的校验规则。
自定义错误提示
在上面的示例中，我们是通过访问 validationResult.error.details[0].message 来获取错误提示信息的。但是对于一些复杂的应用场景，这种错误提示可能并不具有足够的灵活性。
这时候，我们可以通过传递一个 errorMessages 参数来自定义错误提示信息。例如：
-- -------------------- ---- -------
----- ------ - ------------
------ --------------------------------
--------- ------------------------------
----------------- -- -
-------------------- -- -
------ ---------- -
---- ---------------
----------- - -------------
------
---- -------------
----------- - ------- - ---
------
--------
------
-
---
------ -------
---
----- --------- - --- ----------------- -
-------------- -
------ -
--------- ----------
------ ------------
--
--------- -
--------- --------
---- ------- - --
-
-
---上面的示例中，我们通过调用 error 函数来自定义错误提示信息，并通过 code 属性来判断校验错误的类型。其它更详细的用法可以查看 joi 的文档。
在实例化一个 Validator 时，我们可以传递一个 errorMessages 对象来替换默认的错误提示信息。当校验失败时，Validator 会替换掉默认的错误提示信息。
总结
vz-rn-joi 是一个较为实用的 React Native 数据校验库，使用起来方便快捷，也可以通过自定义错误提示信息来满足更加复杂的业务需求。希望本文能够帮助读者更好地使用 vz-rn-joi 进行数据校验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005596081e8991b448d6cde