SuperAPI AI 工具集

formily ant design components

设计与创作

查看项目

更新于 10-16 06:15

技能介绍

用途:当用户提出「use formily with ant design」「formily antd components」「formily ant design integration」等需求时使用,指导在 TypeScript 中集成 Formily 与 Ant Design 组件,覆盖表单布局、字段组件、校验与常见模式。

主要能力:介绍表单布局(基础布局、Grid、Tabs);常用 Ant Design 字段组件(Input、Input.Password、Input.TextArea、Select、DatePicker、RangePicker、TimePicker、Checkbox、Radio、InputNumber、Switch、Slider、Upload、Rate、Mentions 等);内置校验与自定义校验消息;Schema 驱动表单;提交、重置等表单操作;动态表单区块与数组字段(如 ArrayCards)。资料还提到示例文件 examples/antd-form-layouts.tsx、examples/validation-patterns.tsx,以及参考文件 references/component-mapping.md、references/styling-guide.md。

使用方式:先安装依赖:npm install @formily/antd @formily/core @formily/react、npm install antd,并为 TypeScript 安装类型:npm install -D @types/react @types/react-dom。随后用 createForm 创建表单实例,用 createSchemaField 注册组件,并用 FormProvider 包裹 Form 使用。

适用场景:需要在 React + TypeScript 项目中以 Formily 驱动 Ant Design 表单、希望获得布局与校验示例的开发者。

限制:资料未提供收费、价格、平台兼容性、性能或效果信息;未给出的内容不作推断。