antd vue表单验证_antd表单验证this.form.validateFields不能处理错误情况。

问题描述

在vue框架内使用ant-design组件,页面内有一个表单，设定的表单规则比较简单，就是必填。但是即使什么都不输入，直接提交也可以输入内容也可以新增或修改成功。也就是表单的校验规则没有生效。

问题出现的环境背景及自己尝试过哪些方法

我猜测this.form.validateFields会自动处理错误情况，然后这项任务可能是比较底层的依赖去做的，ant-design文档页提到了async-validator，于是手动安装了async-validator，但是没有一点帮助。

相关代码

// 只列举一个表单项，其他的规则都是必填。

label="标题"

:labelCol="formItemLayout.labelCol"

:wrapperCol="formItemLayout.wrapperCol">

v-decorator="[

'title',

{initialValue: formData.title, rules: [{ required: true, message: '请输入标题' }]}

]"

placeholder="标题" />

// 提交

async handleSubmit (e) {

event.preventDefault()

this.form.validateFields((err, values) => {

if (!err) {

Object.ass