@xwink/ui

Field

XField 是一个完整字段:负责可见标签、提示、错误状态、控件关联和规则校验。它通过上下文与内部控件交换取值、聚焦和无障碍属性,因此控件本身不需要 labelhintinvalidrules props。

字段可以脱离 XForm 独立使用,适合筛选项、行内编辑、弹窗里的单字段确认等非表单提交场景:

独立字段校验

离开输入框后独立校验,不需要放进 XForm

规则兼容 async-validator 的字段规则,并额外支持 trigger: 'blur' | 'change' | 'submit' 或触发器数组。首次输入不会立即报错;字段失焦或提交后,后续输入会及时更新已有校验结果。没有声明 trigger 时默认在失焦校验,提交始终执行全部规则。

error 用于回显服务端字段错误,优先于内部校验消息;hint 只在没有错误时显示。每个 XField 应只放一个可注册的表单控件。

通过模板引用可调用 validate()clearValidate()focus()

API

Props

名称类型默认值说明
namestring | undefinedundefined字段标识,仅用于 XForm 汇总结果与定位,不参与取值
labelstring | undefinedundefined
hintstring | undefinedundefined
rulesFieldRules | undefinedundefined
errorstring | undefinedundefined外部错误优先于内部校验结果,适合回显服务端字段错误
reserveMessageSpaceboolean | undefinedfalse没有提示或错误时仍保留消息行高度
controlIdstring | undefinedundefined自定义关联控件 id;缺省时自动生成

Emits

事件载荷说明
validate[result: FieldValidationResult]

Slots

插槽说明
label
default
message