Formily Core Fundamentals 是一个用于学习 Formily 的入门技能，主要面向希望在 React 中使用 Formily 作为表单解决方案的开发者。其重点在于理解核心概念、搭建 Formily 项目，以及使用 TypeScript 实现基础表单。
用途 该技能适用于用户提出“学习 Formily 基础”“搭建 Formily”“Formily 核心概念”“Formily 入门”等需求时，提供使用 Formily 作为 React 表单解决方案的基础指导。
主要能力 Formily 被描述为一个高性能、灵活且可扩展的 React 表单解决方案，提供以下能力：
- Schema 驱动表单：通过 JSON schema 定义表单。
- 基于路径的值管理：通过路径字符串访问嵌套表单值。
- 强大的校验：内置校验并支持自定义规则。
- 细粒度响应式：高效更新并尽量减少重渲染。
- TypeScript 支持：为表单和校验提供完整类型安全。
安装与搭建 安装核心 Formily 包： npm install @formily/core @formily/react @formily/validate
如需 TypeScript 支持，安装类型： npm install -D @types/react @types/react-dom
基础表单实现 技能以创建一个简单联系表单为例说明 Formily 基础：
- 定义表单 Schema：使用 createForm 并传入 initialValues。
- 将表单连接到 React：使用 FormProvider 包裹表单字段。
- 创建表单字段：使用 Field 组件，通过渲染函数获取 field 与 state，绑定 value 与 onChange。
表单状态管理 通过表单实例管理表单状态：
- 访问表单值：form.values 获取全部值，form.values.name 获取特定字段值，form.values.contact.address 获取嵌套值。
- 设置表单值：form.setValues 可设置单个、多个或嵌套字段值，例如 form.setValues({ 'user.profile.name': 'John Doe' })。
字段状态管理
- 访问字段状态：通过 form.query('name') 获取字段，读取 field.value、field.errors、field.touched。
- 修改字段状态：使用 form.setFieldState('name', state => { ... }) 修改 value、errors 等。
校验基础 Formily 提供内置校验能力：
- Schema 校验：在 schema 中通过 required、format、x-validator 等定义校验规则，例如必填、最小长度、邮箱格式。
- 自定义校验规则：通过 effects 中的 onFieldChange 监听字段变化并手动设置 field.errors，例如确认密码一致性校验。
表单提交 提交时先调用 await form.validate() 校验整个表单，然后读取 form.values，必要时调用 form.reset() 重置表单；校验失败时捕获错误。
TypeScript 集成
- 定义表单类型：通过 interface 定义表单结构，并使用 createForm<ContactForm> 创建带类型的表单。
- 类型安全的字段组件：为字段组件定义 props 接口，结合 Field 使用。
常见模式
- 条件字段：通过 onFieldChange 监听某字段值，使用 form.setFieldState 控制其他字段的 visible 与 value。
- 动态字段数组：使用 form.pushValues、form.removeValues、form.insertValues 操作数组字段。
性能优化
- 减少重渲染：使用 @formily/reactive-react 的 observer 包裹性能关键组件。
- 批量更新：使用 form.batch(() => { ... }) 批量执行多次状态更新。
错误处理
- 全局错误处理：在 effects 中使用 onError 处理表单级错误。
- 字段级错误处理：使用 onFieldError 针对特定字段的错误做自定义 UI 处理。
附加资源 技能包含参考文件与示例文件：
- references/types-cheatsheet.md：常见 TypeScript 类型与接口。
- references/validation-rules.md：内置校验规则参考。
- examples/simple-contact-form.tsx：完整可运行的联系表单示例。
- examples/field-components.tsx：可复用字段组件模式。
常见 Formily 模式与最佳实践
- 使用 form.submit() 进行带校验的表单提交。
- 使用 form.reset() 清除表单状态。
- 使用 form.setFieldState() 进行细粒度字段控制。
- 通过 x-validator 或 effects 实现自定义校验器。
- 始终为表单 schema 定义 TypeScript 接口。
- 尽可能使用 schema 校验而非手动校验。
- 对性能关键组件使用 observer。
- 在表单和字段两个层面优雅处理错误。
- 对多次状态更新使用批量操作。
- 创建可复用字段组件以减少代码重复。
- 使用边界情况和错误场景充分测试校验。
限制 资料未提供该技能的具体收费、价格、支持平台、实际效果或完整使用步骤等事实，相关内容暂未提供。