⚡

表单创建器 form-creator

这是一个用于快速生成数据录入表单、验证模式和对应CRUD API端点的开发工具。它帮助开发者高效构建和管理表单功能，提升开发效率，确保数据验证和API安全性。关键词：表单生成、数据验证、CRUD API、前端开发、后端开发、Zod模式、React表单、API路由。

前端开发 0 次安装 0 次浏览 更新于 3/1/2026

name: form-creator description: 创建表单、验证模式和CRUD API端点。在构建新的数据录入功能或管理现有表单时使用。

表单创建器

使用说明

1. 验证模式

  • 文件: src/lib/validations/{feature}.schema.ts
  • 操作: 定义Zod模式并导出推断类型。
    export const featureSchema = z.object({ ... });
export type FeatureFormValues = z.infer<typeof featureSchema>;

2. 表单组件

  • 文件: src/components/forms/{feature}-form.tsx
  • 指令: 必须包含 "use client";。
  • 设置: 使用 useForm 配合 zodResolver。
  • 属性: 接受 initialData 和 onSubmit。
  • 界面: 使用Shadcn组件（Form、FormField、Input）。

3. API路由

  • 文件: src/app/api/{feature}/route.ts
  • 安全性: 使用 withAuthRequired 或 withSuperAdminAuthRequired 包装。
  • 逻辑:
    • GET: 处理分页/搜索。
    • POST: 根据模式验证请求体 -> 插入数据库。
    • PATCH: 验证部分请求体 -> 更新数据库。

参考

有关代码模式、最佳实践和示例，请参阅 reference.md。