Form 表单

动态配置式表单组件，支持模板式和函数式两种用法。

基础用法

通过配置快速生成表单。

动态组件

支持使用 compType 配置不同的表单组件类型，compProps 传递组件属性。

插槽

通过 prop 对应插槽名称。

函数式用法

使用 useEplForm 创建表单组件。

API

属性

属性名	说明	类型	默认值
modelValue / v-model	表单数据对象	object	—
items	表单项配置	TFormItem[]	[]
rules	表单验证规则	FormRules	—

TFormItem 配置

属性名	说明	类型
label	标签文本	string
prop	字段名	string
placeholder	占位文本	string
span	栅格占据的列数	number
hidden	是否隐藏	boolean
compType	组件类型	string | VNode | Component
compProps	组件属性	object

方法

方法名	说明	类型
validate	验证表单	() => Promise<boolean>
resetFields	重置表单	() => void

useEplForm

函数式创建表单。

const { formComp, validate, resetFields } = useEplForm({
  modelValue,
  rules,
  items,
});

参数

参数名	说明	类型
modelValue	表单数据对象	Ref<object>
rules	表单验证规则	FormRules
items	表单项配置	TFormItem[] | ComputedRef<TFormItem[]>

返回值

属性名	说明	类型
formComp	表单组件	Component
validate	验证表单方法	() => Promise<boolean>
resetFields	重置表单方法	() => void