Skip to content

DyFormItem

DyFormItem 是动态表单的单项配置类型。你传入 AdDynamicFormitems 数组,每一项就是一个 DyFormItem

TIP

下方类型大多数与vue3版本的属性类似

SelectOptionItem

字段说明类型默认值必填
label展示文本string
value选项值any
className自定义 classstring
style自定义样式string | CSSProperties
disabled是否禁用boolean

BaseDyFormItem

字段说明类型默认值必填
key字段标识(建议与表单 model 字段一致)keyof T
label表单项 labelstring
value响应式值(表单数据来源)any,使用useReactiveFormuseDecorateForm会做相应式包装处理
placeholder占位提示string
options选项数据(select/checkbox/radio 等)SelectOptionItem[] | any[]
onChange值变化回调(value: any, associationItem: DyFormItem, options?: SelectOptionItem[] | any[]) => void
span栅格占位(preset="grid" 时常用)number
offset偏移占位(preset="grid" 时常用)number
sort排序字段(如果启用排序逻辑则按此排序)number

DyFormItem

DyFormItem<K, RuleT> 继承自 BaseDyFormItem<K>,并扩展渲染、校验、显示控制等能力。

字段说明类型默认值必填
path表单校验 path(不传则默认使用 keystring
hidden是否隐藏该项booleanfalse
render2自定义渲染函数(返回 ReactNode)(formItem: DyFormItem) => ReactNode
rule单项校验规则(由具体 UI 层决定类型,如 Naive UI 的 FormItemRule 等)RuleT
required简化必填(若未传 rule,可自动生成必填规则)booleanfalse
requiredHint必填提示(label: string) => string"label"不能为空
disabled禁用状态(支持 boolean)booleanfalse
allowClear是否允许清空booleanfalse
type简化类型(常用于 input)"text" | "textarea" | "password""text"
rows多行输入行数(type="textarea" 常用)number
labelFieldoptions 的 label 字段名映射string
valueFieldoptions 的 value 字段名映射string
childFieldoptions 的 child 字段名映射string
showSearch是否可过滤(select 类常用)boolean-
searchOnLabel是否可过滤(按label值过滤)boolean-
showCount是否显示字数boolean-
mode渲染模式'multiple' | 'tags'-
isCustom是否自定义校验规则boolean-
formItemPropsForm.Item 属性object-

关于 RuleT

DyFormItemrule 使用泛型 RuleT 以避免在通用类型文件中绑定某个 UI 框架。
例如在 Antd 模块中可以把 RuleT 绑定为 Rule \| Rule[]