# @abgov/jsonforms-components 中文文档

规范地址：https://npmcn.com/package/%40abgov/jsonforms-components/

版本：2\.82\.1
npm 元数据更新时间：2026-11-06T19:13:33.516Z
中文译文更新时间：2026-11-06T17:09:54.352Z
软件包许可：Apache-2\.0

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

原始 npm 页面：https://www.npmjs.com/package/%40abgov/jsonforms-components
原文对照：https://npmcn.com/package/%40abgov/jsonforms-components/?lang=original
项目主页：https://github.com/GovAlta/adsp-monorepo#readme
源码仓库：https://github.com/GovAlta/adsp-monorepo

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

- 包体积（解压后）：973 kB，174 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：3 个
- peer 依赖：ajv ^8\.6\.1，xss ^1\.0\.15，react ^18\.0\.0，dompurify ^3\.2\.4，pluralize ^8\.0\.0，ajv-errors ^3\.0\.0，@mdx-js/mdx ^3\.1\.0，ajv-formats ^3\.0\.1，expr-eval-fork ^3\.0\.1，react-markdown ^8\.0\.3，@jsonforms/core ^3\.1\.0，rehype-sanitize ^6\.0\.0，@jsonforms/react ^3\.1\.0，@abgov/react-components ^6\.9\.3，@abgov/ui-components-common 2\.2\.1
- 首次发布：2024-03-08T21:57:10.057Z
- 最新版本发布：2026-11-06T19:13:33.177Z
- 近 30 天下载量：2633（2026-10-05 至 2026-11-03，npm 官方下载统计）
- 已发布版本数：514（近 12 个月 194 个）

## 中文简介

艾伯塔省政府 - 基于设计系统的JSON表格反应渲染器.

## 安装

```sh
npm install @abgov/jsonforms-components
```

也可以使用：`pnpm add @abgov/jsonforms-components`、`yarn add @abgov/jsonforms-components`、`bun add @abgov/jsonforms-components`

## README

# jsonforms - 组件

这个库是用 [无](https://nx.dev/)。 。 。 .

## 运行单元测试

运行 `nx test jsonforms-components` 通过 [欢乐](https://jestjs.io/)。 。 。 .

# 文件夹等级

```
- src
  - lib
    - Additional
    - Cells
    - common
    - Components
    - Controls
    - Context
    - ErrorHandling
    - layouts
    - util

```

# 嵌入中的 ADSP 应用程序中的窗体服务 UI 组件

要使用 ADSP 表格服务 UI 组件在 JSON 表格中添加到您的应用程序中 。 您必须加入以下 JSX 标记并输入到您的反应组件中作为例子 .

```
import { JsonForms } from '@jsonforms/react';
import {
  GoARenderers,
} from '@abgov/jsonforms-components';
```

```
      <JsonForms
        schema={yourJSONDataSchema}
        uischema={yourJSONUISchema}
        data={data}
        validationMode="ValidateAndShow"
        renderers={GoARenderers}
        onChange={onChange}
      />
```

# 高级秘书处 窗体服务 UI 组件 UI schema

[UI 司马](https://jsonforms.io/docs/uischema) 在JSON表格中定义了生成的形式的一般布局. @abgov/jsonforms-组件 lib 集成 [GoA UI 组件](https://github.com/GovAlta/ui-components) 通过扩展UI Schema中的"选项"属性来构成组件。 以GOAInput UI Schema为例: [https://govalta.github.io/adsp-monorepo/tourics/form-service/building-forms.html 互联网档案馆的存檔,存档日期2014-12-22](https://govalta.github.io/adsp-monorepo/tutorials/form-service/building-forms.html)

```
    {
      "type": "Control",
      "scope": "#/properties/name",
      "options": {
        "GoAInput": {
          "name": "Name",
          "label": "Name",
          "testId": ""
          ...
        }
      }
    }
```

"GOAInput"的存在表明我们将使用GOAInput来提供输入. “ GOAInput” 中的属性将作为组件属性传递给 GOAInput .

有关控制、布局、阶梯的更多信息和使用情况,请参见ADSP表格服务指南,该指南提供了更多信息 [深度资料](https://govalta.github.io/adsp-monorepo/tutorials/form-service/form-service.html) 关于用法.

请参看 [骗局](https://govalta.github.io/adsp-monorepo/tutorials/form-service/cheat-sheet.html) 它包含用于当前从ADSP Form服务UI组件中可以获得的不同类型的控件、阶梯、布局等的图例,可用于您的应用程序的UI计划.

## 常见问题

### @abgov/jsonforms-components 是什么？

艾伯塔省政府 - 基于设计系统的JSON表格反应渲染器\.

### 如何安装 @abgov/jsonforms-components？

在项目目录运行 npm install @abgov/jsonforms-components，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：ajv（^8\.6\.1）、xss（^1\.0\.15）、react（^18\.0\.0）、dompurify（^3\.2\.4）、pluralize（^8\.0\.0）、ajv-errors（^3\.0\.0）、@mdx-js/mdx（^3\.1\.0）、ajv-formats（^3\.0\.1）、expr-eval-fork（^3\.0\.1）、react-markdown（^8\.0\.3）、@jsonforms/core（^3\.1\.0）、rehype-sanitize（^6\.0\.0）、@jsonforms/react（^3\.1\.0）、@abgov/react-components（^6\.9\.3）、@abgov/ui-components-common（2\.2\.1）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @abgov/jsonforms-components 支持 TypeScript 吗？

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

### @abgov/jsonforms-components 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @abgov/jsonforms-components 可以商用吗？

@abgov/jsonforms-components 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @abgov/jsonforms-components 的下载量有多少？

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

### @abgov/jsonforms-components 还在维护吗？

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