SuperAPI AI 工具集

generate-frontend-forms

前端与建站

查看项目

更新于 10-15 21:51

技能介绍

用途:该技能是 Sentry 新表单系统的开发指南,用于在实现表单、表单字段、校验或自动保存功能时提供统一模式。核心原则是新建表单必须使用新系统(useScrapsForm、AutoSaveForm),不要再用旧的 JsonForm 或基于 Reflux 的系统;所有表单都应基于 schema,不得创建无 schema 校验的表单。

主要能力:表单组件统一从 @sentry/scraps/form 导出,禁止从更深路径导入。useScrapsForm 是创建表单的主 hook,需先展开 defaultFormOptions,校验器以 onDynamic 定义,使校验在首次提交后随每次变更运行。返回 AppForm、AppField、FieldGroup、SubmitButton、Subscribe、reset、handleSubmit 等。字段通过 field 渲染属性访问,内置 Input、Number、Select(单选/多选)、Switch、TextArea、Range、Radio.Group/Radio.Item 等;自定义字段用 field.Base,自动处理 ref 合并、自动保存时禁用、aria-invalid、aria-describedby 等。布局提供 Stack(纵向)与 Row(横向),均支持 variant="compact" 将提示文本改为标签 tooltip;也可不用布局,改用 field.Meta.Label 与 field.Meta.HintText。FieldGroup 用于分组。禁用字段可传字符串作为原因 tooltip。

校验与错误:使用 Zod 定义 schema,支持 refine 做跨字段校验;可空字段用 .nullable().refine(),defaultValues 显式标注为 z.input,onSubmit 内用 schema.parse 收窄为 z.output,避免非空断言或类型转换。条件字段用 form.Subscribe 按其他字段值显示/隐藏。服务端错误用 setFieldErrors 展示,它只接受 Scraps FieldErrors 契约,不接受 Sentry 的 RequestError,需在应用边界用 requestErrorToFieldErrors 转换;支持点号嵌套路径。

限制:资料未提供安装命令、版本要求、收费与平台信息;示例代码仅作模式参考,实际使用需遵循 Sentry 代码库的公开接口约束。