创建您自己的 React 验证库：基础知识（第 1 部分）

Desknumber

有没有想过验证库是如何工作的？本文将告诉您如何逐步构建您自己的 React 验证库。下一部分将添加一些更高级的功能，最后一部分将重点改善开发者体验。

我一直认为表单验证库非常酷。我知道，这是一个小众兴趣——但我们经常使用它们！至少在我的工作中，我所做的大部分工作是使用依赖于早期选择和路径的验证规则来构建或多或少复杂的表单。了解表单验证库的工作原理至关重要。

去年，我编写了一个这样的表单验证库。我将其命名 电子邮件营销列表 为“校准”，您可以在此处阅读介绍性博客文章。这是一个很好的库，提供了很大的灵活性，并且使用与市场上其他库略有不同的方法。不过，还有很多其他很棒的库——我的库很好地满足了我们的要求。



今天，我将向您展示如何为 React 编写您自己的验证库。我们将逐步完成该过程，您将在我们进行过程中找到 CodeSandbox 示例。读完本文后，您将知道如何编写自己的验证库，或者至少更深入地了解其他库如何实现“验证的魔力”。

卷起袖子，提高您的用户体验技能：使用智能界面设计模式 ，这是 Vitaly Friedman 的 9 小时视频库。数百个真实示例和现场用户体验培训。免费预览。

创建任何库的第一步是设计它的使用方式。它为未来的许多工作奠定了基础，在我看来，这是您在图书馆中要做的最重要的决定。

创建一个“易于使用”且足够灵活以允许未来改进和高级用例的 API 非常重要。我们将努力实现这两个目标。

我们将创建一个接受单个配置对象的自定义挂钩。这将允许未来的选项在不引入重大更改的情况下通过。

关于 HOOK 的注意事项 Hooks 是一种相当新的 React 编写方式。如果您过去编写过 React，您可能不认识其中一些概念。这种情况，请查看官方文档。它写得非常好，并带您了解您需要了解的基础知识。