# Form 表单

WARNING

为什么在表单验证时，明明已经有值，却还是验证不通过？

因为表单验证时使用了 sync-validator，根据 rules 官方文档，需提供 Type 类型，默认是 string，如 type: 'number/boolean/array/object'，请参考 sync-validator

国际化（多语言）

1、超出两行显示省略号 2、以字母省略 3、以单词换行（允许字母换行） 4、鼠标悬浮：考虑到性能问题，悬浮可以用原生 title 支持

Vue.use(WinDesign, { i18nOverflow: true })

参数	说明	类型	可选值	默认值	Version
show-colon	是否显示 label 后的冒号	Boolean	—	false	v2.0.8
hide-required-asterisk	是否隐藏必填字段的标签旁边的红色星号	Boolean	—	—	v2.0.0
inline	是否为行内表单	Boolean	—	—
inline-message	是否以行内形式展示校验信息	Boolean	—	—	v2.0.0
label-width	label 的长度, 支持 auto 属性，label 自由展开	String	—	—	v1.7.10
label-align	label 对齐方式	String	'left' \| 'right' \| 'center' \| 'top'	—
label-position	* 同 label-align	String	'left' \| 'right' \| 'center' \| 'top'	—	v2.0.0
label-suffix	表单域标签的后缀	String	—	—	v2.0.0
model	表单绑定的数据	Object	—	—
rules	表单的验证规则	Object	—	—
~~sizes~~	控制表单元素大小(已在 v2.0.0 被废弃, 被`size`代替)	String	'large' \| 'medium' \| 'small' \| 'mini'	—
size	控制表单元素大小	String	'large' \| 'medium' \| 'small' \| 'mini'	—
text	是否为纯文本表单	Boolean	—	—
show-message	是否显示提示文字	Boolean	—	true	v2.0.0
validate-on-rule-change	是否在 `rules` 属性改变后立即触发一次验证	Boolean	—	true	v2.0.0
show-error-bg	验证时错误提示背景色块	Boolean	—	false	v2.1.1
correct-label-wrap	纠正 label 文字超出正确换行	Boolean	—	false	v2.4.30
hide-asterisk-when-no-required	非必填时隐藏字段的标签旁边的红色星号占位	Boolean	—	false	v2.4.37

事件名称	说明	回调参数	Version
clearValidate	清除表单元素的验证结果(props 可以是 string \| array 如果不传参则默认清空所有表单元素的验证结果)	Function(props: string \| array)	v1.5.22
resetFields	重置表单, 将字段值重置为初始值	—
validateField	验证表单部分字段	Function (props: array \| string, cb)	v1.4.13
validateForm	验证表单(回调函数第一个参数 valid 表示表单是否验证成功, 第二个参数 invalidFields 是所有未通过验证的表单字段)	Function (cb: Function(valid, invalidFields))	v1.5.25
validate	* 同 validateForm	Function (cb: Function(valid, invalidFields))	v2.0.0
validatePromise	* 同 validateForm (支持异步)	Function (cb: Function(valid, invalidFields))	v2.3.6

事件名称	说明	回调参数	Version
validate	任一表单项被校验后触发	被校验的表单项 prop 值，校验是否通过，错误消息（如果存在）	v2.0.0
validatePromise	任一表单项被校验后触发（支持异步）	被校验的表单项 prop 值，校验是否通过，错误消息（如果存在）	v2.3.6

参数	说明	类型	可选值	默认值	Version
label	label 的文本值	String	—	—
label-width	label 的长度, 支持 auto(优先级高于 form 中的 labelWidth 属性)	String	—	—	v1.7.12
prop	在表单 model 中的所属字段, 需要验证或重置表单时必填	String	—	—
rules	该表单的验证规则	Array	—	—
required	是否必填	Boolean	—	true
show-message	是否显示提示文字	Boolean	—	true
empty-placeholder	是否显示空数据下占位背景块	Boolean	—	false	V2.4.27
help-tips	表单项帮助指引提示内容	String	—	-	V2.4.27
help-tips-theme	tooltip 主题	String	—	light	v2.4.27
help-tips-placement	tooltip 位置	String	—	top	v2.4.27
help-tips-position	图标位置	String	—	left	v2.4.27
help-tips-icon	表单项帮助指引提示 icon	String	—	w-icon-qmark-solid	V2.4.32

事件名称	说明	回调参数	Version
help-tips-click	点击表单项帮助指引提示 icon		V2.4.32

事件名称	说明	回调参数	Version
resetField	对该表单项进行重置，将其值重置为初始值并移除校验结果	Function(props: string \| array)	v1.5.22
clearValidate	移除该表单项的校验结果	—