---
name: deppon-pro-field
description: >-
    在非 ProForm 场景下单独使用 ProField：valueType、v-model 绑定、read/edit 模式、fieldProps。
    在用户提到 ProField、单字段组件、与 el-form-item 组合时应用。
---

# deppon-pro-field

## 依据来源（私有 npm）

-   **`deppon-npm-private-registry`**。
-   **`@deppon/deppon-template`**：`ProField` — README / `*.d.ts` 中 `value-type`、v-model、 `fieldProps`、 `mode`。
-   **`@deppon/deppon-ui`**：`el-form`、`el-form-item`（或包文档推荐包裹方式）。
-   **`deppon-npm-skills`**。不默认读取 `deppon-npm` 的 `site/`。

## 要点

-   `import { ProField } from '@deppon/deppon-template'`。
-   包裹在 `el-form` + `el-form-item` 中；`v-model:text` 等绑定随 `value-type` 变化（支持的类型以 **`ProField` 文档/类型** 为准）。
-   `:mode="'read' | 'edit'"` 切换展示与编辑。
-   `:field-props` 传占位、前后缀、图标、`rangeFormat: 'array'` 等。

## 生成清单

-   [ ] 选对 `value-type` 与对应 v-model 后缀（以 **`ProField` 类型定义** 为准）。
-   [ ] 图标类使用 `@deppon/deppon-ui/icons-vue` 传入 `field-props`。
-   [ ] 需要整表单校验时优先用 `ProForm`；仅少量展示/编辑时用本模式。