# @buildnbuzz/form-core 中文文档

规范地址：https://npmcn.com/package/%40buildnbuzz/form-core/

版本：0\.1\.12
npm 元数据更新时间：2026-06-09T19:20:35.845Z
中文译文更新时间：2026-11-08T19:28:16.038Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40buildnbuzz/form-core
原文对照：https://npmcn.com/package/%40buildnbuzz/form-core/?lang=original
项目主页：https://form.buildnbuzz.com/
源码仓库：https://github.com/buildnbuzz/buzzform

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：628 kB，9 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：0 个
- 首次发布：2026-03-30T21:00:19.340Z
- 最新版本发布：2026-06-09T19:20:35.540Z
- 近 30 天下载量：3354（2026-10-09 至 2026-11-07，npm 官方下载统计）
- 已发布版本数：13（近 12 个月 13 个）

## 中文简介

框架-不可知核原始为BuzzForm.

## 安装

```sh
npm install @buildnbuzz/form-core
```

也可以使用：`pnpm add @buildnbuzz/form-core`、`yarn add @buildnbuzz/form-core`、`bun add @buildnbuzz/form-core`

## README

# @ burnbuzz/ form- core (中文(简体) )

框架-可知性为BuzzForm所形成的原始. 零 DOM 或 UI 依赖性 .

## 安装

```bash
pnpm add @buildnbuzz/form-core
```

## 快速启动

```ts
import { defineSchema, type InferType } from "@buildnbuzz/form-core";

const schema = defineSchema({
  title: "Contact Form",
  fields: [
    { type: "text", name: "name", label: "Name", required: true },
    { type: "email", name: "email", label: "Email", required: true },
  ],
});

type FormData = InferType<typeof schema.fields>;
// { name: string; email: string }
```

## 核心特征

### Schema 定义

使用 `defineSchema` 用于具有自动受精型号的型号安全计划:

```ts
import { defineSchema, type InferType } from "@buildnbuzz/form-core";

const schema = defineSchema({
  id: "user-profile",
  title: "User Profile",
  description: "Update your profile",
  fields: [
    { type: "text", name: "firstName", label: "First Name", required: true },
    { type: "number", name: "age", label: "Age", min: 18, max: 120 },
    {
      type: "select",
      name: "role",
      label: "Role",
      options: [
        { label: "Admin", value: "admin" },
        { label: "User", value: "user" },
      ],
    },
  ],
});
```

### 动态值

参考窗体数据( E)`$data`)或外部环境(`$context`对于动态标签、默认和条件:

```ts
const schema = defineSchema({
  fields: [
    { type: "text", name: "firstName", label: "First Name" },
    {
      type: "text",
      name: "greeting",
      label: { $data: "/firstName" }, // Dynamic label
      defaultValue: { $context: "/defaultGreeting" }, // Dynamic default
    },
  ],
});
```

### 可见条件

基于窗体数据或上下文显示/隐藏字段 :

```ts
const schema = defineSchema({
  fields: [
    { type: "text", name: "email", label: "Email" },
    {
      type: "text",
      name: "confirmEmail",
      label: "Confirm Email",
      condition: { $data: "/email", contains: "@" }, // Only show if email contains @
    },
  ],
});
```

支助 `$and`, (中文(简体) ), `$or`,比较运算符(`eq`, (中文(简体) ), `neq`, (中文(简体) ), `gt`, (中文(简体) ), `lt`, (中文(简体) ), `contains`(见a/c.5/49/70,附件).

### 验证

从字段属性加自定义规则中自动生成的验证符:

```ts
const schema = defineSchema({
  fields: [
    {
      type: "text",
      name: "username",
      label: "Username",
      required: true,
      minLength: 3,
      validate: {
        onBlur: {
          checks: [
            {
              type: "usernameAvailable",
              message: "Username is taken.",
            },
          ],
        },
      },
    },
    {
      type: "password",
      name: "confirmPassword",
      label: "Confirm Password",
      required: true,
      validate: {
        onSubmit: {
          checks: [
            {
              type: "matches",
              args: { other: { $data: "/password" } },
              message: "Passwords do not match.",
            },
          ],
        },
      },
    },
  ],
});
```

使用 `defineValidators`数字 :

```ts
import { defineValidators } from "@buildnbuzz/form-core";

const customValidators = defineValidators({
  usernameAvailable: async (value: unknown) => {
    if (typeof value !== "string") return false;
    
    const available = await checkUsername(value);
    return available ? true : "Username is taken";
  },
});
```

### 输出变换

平整嵌入式提交数据为路径键格式 :

```ts
import { transformFormOutput } from "@buildnbuzz/form-core";

const payload = transformFormOutput(
  { profile: { name: "Ada" } },
  { type: "path" },
);
// { "profile.name": "Ada" }
```

## 字段类型

**基础 :** `text`, (中文(简体) ), `email`, (中文(简体) ), `password`, (中文(简体) ), `textarea`, (中文(简体) ), `number`  
**选择 :** `select`, (中文(简体) ), `radio`, (中文(简体) ), `checkbox`, (中文(简体) ), `switch`, (中文(简体) ), `tags`  
**复杂 :** `date`, (中文(简体) ), `group`, (中文(简体) ), `array`  
**布局 :** `row`, (中文(简体) ), `tabs`, (中文(简体) ), `collapsible`

## 类型推论

| 配置 | 推导类型 |
| --- | --- |
| `required: true` | 需要的密钥 |
| 没有 `required` | 可选密钥 (E)`?`(中文(简体) ) |
| `type: "group"` | 嵌入对象 |
| `type: "array"` | 嵌入对象阵列 |
| `type: "select"` + 键 `hasMany: true` | `string[]` |
| `type: "checkbox"` + 键 `tristate: true` | `boolean | null` |

## 资源

-   [@ burnbuzz/ form- react](https://npmcn.com/package/%40buildnbuzz/form-react/README.md) ——反应适配器

## 常见问题

### @buildnbuzz/form-core 是什么？

框架-不可知核原始为BuzzForm\.

### 如何安装 @buildnbuzz/form-core？

在项目目录运行 npm install @buildnbuzz/form-core，或使用 pnpm add / yarn add / bun add。

### @buildnbuzz/form-core 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @buildnbuzz/form-core 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @buildnbuzz/form-core 可以商用吗？

@buildnbuzz/form-core 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @buildnbuzz/form-core 的下载量有多少？

根据 npm 官方下载统计，@buildnbuzz/form-core 在 2026/10/09 – 2026/11/07 这 30 天内被下载 3,354 次，日均约 112 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @buildnbuzz/form-core 还在维护吗？

最新版本 0\.1\.12 发布于 2026/06/10（4 个月前）；至今共发布 13 个版本，其中过去 12 个月发布了 13 个；首次发布于 2026/03/31。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。

