简介
formulario-rues 是一个基于 React 的表单验证组件库。通过使用 formulario-rues，我们可以轻松地在 React 中构建经过验证和安全的表单应用程序。它提供了一些常见的验证规则，并且可以自定义您自己的规则。
安装
我们可以使用 npm 或 yarn 安装 formulario-rues。
npm install formulario-rues
或者
yarn add formulario-rues
如何使用
首先，通过导入 formulario-rues，我们可以在 React 组件上使用它。
import React, { Component } from 'react';
import { Formulario } from 'formulario-rues';然后，我们可以在组件中渲染 Formularo 组件并传入要验证的表单元素和验证规则。
-- -------------------- ---- -------
----- ------ ------- --------- -
----- - -
------ ---
--------- ---
--
------------ - ------ -- -
--------------------
--
-------- -
------ -
-----------
----------------------------
--------------------------
--------------
------ -
--------- -----
------ -----
--
--------- -
--------- -----
---------- --
--
---
-----
------ -----------------------------
------ ----------- ---------- ------------ --
------
-----
------ -----------------------------------
------ --------------- ------------- --------------- --
------
------- -----------------------------
-------------
--
-
-上述代码展示了如何使用 formulario-rues 在 React 组件中处理一个基本表单。在验证规则中，我们定义了一个必须填写的电子邮件和一个必须至少包含 8 个字符的密码。
当提交表单时，handleSubmit 函数将被触发并将验证过的表单值作为参数。
自定义验证规则
除了内置的验证规则外，formulario-rues 还提供了一个可以自定义验证规则的方法。以下是一个自定义规则的示例：
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ - ----------- ------------------ - ---- ------------------
----- ------ ------- --------- -
----- - -
----- ---
--
------------ - ------ -- -
--------------------
--
------------------- -
---------------------------------- ----- -- ----- --- ------- -- ----- --- --- -- --------
-
-------- -
------ -
-----------
----------------------------
--------------------------
--------------
----- -
------------- -----
--
---
-----
------ ---------------------------
------ ----------- --------- ----------- --
------
------- -----------------------------
-------------
--
-
-在上面的代码中，我们使用 RegisterValidation 方法来注册一个名为 "requiredName" 的自定义验证规则。这条规则添加了一个条件，如果名称为 "admin"，则会显示错误信息 "Name can not be admin"。
结论
formulario-rues 是一个非常有用的 npm 包，它提供了一个轻量级和可定制的表单验证库。通过使用它，我们可以提高表单安全性，并简化表单验证的实现。希望这篇文章能够帮助你开始使用它。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005561181e8991b448d3083