Skip to content

DyFormItem

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

SelectOptionItem

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

BaseDyFormItem

字段说明类型默认值必填
key字段标识(建议与表单 model 字段一致)keyof T
label表单项 labelstring
value响应式值(表单数据来源)Ref<any>,使用useReactiveFormuseDecorateForm包装的可以省略ref函数,会做包装处理
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自定义渲染函数(返回 VNode)(formItem: DyFormItem) => VNode
reset自定义重置逻辑(formItem: DyFormItem) => void
rule单项校验规则(由具体 UI 层决定类型,如 Naive UI 的 FormItemRule 等)RuleT
required简化必填(若未传 rule,可自动生成必填规则)booleanfalse
requiredHint必填提示(label: string) => string"label"不能为空
disabled禁用状态(支持 boolean 或 Ref<boolean>)boolean | Ref<boolean>false
clearable是否允许清空booleanfalse
type简化类型(常用于 input)"text" | "textarea" | "password""text"
rows多行输入行数(type="textarea" 常用)number
labelFieldoptions 的 label 字段名映射string
valueFieldoptions 的 value 字段名映射string
filterable是否可过滤(select 类常用)booleanfalse
multiple是否多选(select 类常用)booleanfalse

关于 RuleT

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