1.a-form的使用
组件使用：
<a-form :model="bhform" :form="bhform">
<a-form-item label="驳回原因" style="display: flex">
<a-input v-decorator="['refuseReason', { rules: [{ required: true, max: 20, message: '长度为1-20' }]}]" />
</a-form-item>
</a-form>
data定义：
data() {
return {
bhform: this.$form.createForm(this, {name: 'coordinated'}),
}
}
赋值：
this.bhform.setFieldsValue({
'refuseReason': '原因惺惺惜惺惺',
})
清除值：
this.bhform.setFieldsValue({
'refuseReason': '',
})
获取表单内容：
this.bhform.getFieldValue('refuseReason')
重置：
this.bhform.resetFields()
总体校验（提交）：
this.bhform.validateFields((err, values) => {
if (!err) {
//成功
}
})
2.a-form-model的使用
组件使用:
<a-form-model ref="form" :model="model" :rules="validatorRules" >
<a-form-model-item label="通知内容" prop="noticeContent">
<a-input v-model="model.noticeContent" ></a-input>
</a-form-model-item>
</a-form-model>
data定义：
data() {
const integerValid = (rule, cellValue, callback) => {
if (cellValue && !/^\w+$/.test(cellValue)) {
return new Error('应为正整数')
} else {
callback()
}
}
return {
model:{},
validatorRules: {
noticeContent: [
{ max: 500, message: '超过最大长度500!'},
{ validator: integerValid } //自定义校验
]
}
}
赋值：
this.model.noticeContent='xxxxxx' 或者
this.$set(this.model,'noticeContent','xxxxxx')
清除值：
this.model.noticeContent='' 或者
this.$set(this.model,'noticeContent','')
获取表单内容：
this.model.noticeContent
重置：
this.$refs.form.resetFields()
总体校验（提交）：
this.$refs.form.validate(valid => {
if (valid) {
//校验成功
}
})