antdform源码，antd form rules
摘要：
【React】antd的form表单的自定义校验规则的用法1、antd的Form组件自定义校验规则的用法如下：核心方法：自定义校验规则在antd中通过... 【React】antd的form表单的自定义校验规则的用法
1、antd的Form组件自定义校验规则的用法如下：核心方法：自定义校验规则在antd中通过validator方法实现。此方法接受三个参数：rule：包含校验相关的配置信息，如校验字段名、校验触发方式等。value：用户输入的当前字段的值。callback：用于返回校验结果，包括成功或失败时的错误信息。
2、自定义校验规则在antd中通过`validator`方法实现。此方法接受三个参数：`rule`（校验规则）、`value`（输入值）和`callback`（回调函数）。`validator`函数的作用在于验证输入值是否符合规则，并在验证失败时调用`callback`返回错误信息。
3、以注册页面为例，需要验证邮箱、密码和重复密码是否匹配。在SHAdcn/form和zod的配合下，我们首先通过zod定义校验模型，如使用refine方法确保密码和重复密码一致，自定义错误消息和字段路径。接下来，我将antd form组件与上述校验模型结合，虽然代码量大致相当，但在处理values（表单值）时，发现两种方式有区别。
4、其实难点也就是多个Tab页，每个Tab页都有单独的Form表单，通过Modal的一个按钮如何控制，如何去校验多个表单。可以通过Ref实现此操作 首先创建空的Ref数组 渲染界面，循环时每次创建一个Ref，和表单。并且这个表单用当前创建的Ref作为唯一标识。
5、Select组件提供showSearch配置自定义搜索功能，filterOption筛选选项，确保结果与用户输入匹配，不区分大小写。Tabs组件中，通过activeKey设置激活面板，子面板顺序需按index排列，以确保正确显示。Form表单中，获取特定数据时，解构参数提高代码质量，实现表单内元素分组与拆分，优化提交流程。
6、方法一：对一组变量赋值确保在使用setfieldsValue时传递的数据格式与form中定义的field相匹配。例如，如果updatelist是从父组件传递过来的数据，那么应该确保这个数据与form中的field一一对应，避免多传或遗漏参数。
...Antd实现Modal弹框中控制多个Tab页的多个Form表单
1、其实难点也就是多个Tab页，每个Tab页都有单独的Form表单，通过Modal的一个按钮如何控制，如何去校验多个表单。可以通过Ref实现此操作 首先创建空的Ref数组 渲染界面，循环时每次创建一个Ref，和表单。并且这个表单用当前创建的Ref作为唯一标识。
2、基本特性 语法糖和布局设置：ProForm在原有表单基础上加入了语法糖，提供了丰富的布局设置，使得快速构建表单变得极为便利。 默认行为：ProForm的默认行为确保表单功能默认可用，无需额外配置，从而节省了开发时间。 支持的布局 分步表单：适用于需要分步骤填写的复杂表单。
3、ProForm支持多种布局，如分步表单、Modal表单、Drawer表单、查询表单和轻量筛选，覆盖了广泛的应用场景，减少复杂布局工作量，提高开发效率。ProFormFields是表单项的核心，结合了FormItem和组件的功能，支持fieldProps的自定义。
【React】使用antd的Form组件setFieldsValue方法的时候警告
1、方法一：对一组变量赋值确保在使用setFieldsValue时传递的数据格式与form中定义的field相匹配。例如，如果updateList是从父组件传递过来的数据，那么应该确保这个数据与form中的field一一对应，避免多传或遗漏参数。
2、antd的Form组件自定义校验规则的用法如下：核心方法：自定义校验规则在antd中通过validator方法实现。此方法接受三个参数：rule：包含校验相关的配置信息，如校验字段名、校验触发方式等。value：用户输入的当前字段的值。callback：用于返回校验结果，包括成功或失败时的错误信息。
3、react没有v-model这种双向绑定指令。所以要想实现双向绑定，就需要给输入框一个默认的value，并且通过change监听事件去改变value来达到双向绑定的目的。在antd的表单组件中。如果给每个item组件设置了name。那么就不需要去手动实现双向绑定了。只需要通过 form.setFieldsValue方法。将对应的数据传过去。
4、在使用antd的Form组件时，可能需要实现自定义校验规则，以确保输入内容符合特定条件。例如，在验证用户输入的名称时，可能需要通过后台接口进行验证，确保名称不重复或满足其他特定要求。此时，自定义校验规则便显得尤为重要。自定义校验规则在antd中通过`validator`方法实现。
5、Input组件中，suffix属性用于在表单控件尾部显示信息，如显示输入字数，使用getFieldValue（）与suffix配合，获取当前表单输入长度。自定义placeholder样式以提升用户输入体验。注意不同组件获取值的方式不同，select组件直接从value中取值，而input、textarea等文本框则从e.target.value中取值。
6、强制更新表单值的机制是通过 `setFieldsValue` 方法。该方法不涉及状态更新，而是直接更新 `fieldStore` 中的 `fields`，并手动触发更新。频繁使用此方法可能导致性能问题，因为每次更新都会导致组件重新渲染。
