antd vue form表单提交方法不执行问题,并且未报错

1.maxLength设置

<a-input placeholder="请输入管理员姓名"
         maxLength="50"
         v-decorator="['realName',{ rules: [{ required: true, message: '管理员姓名不能为空' }],'initialValue':info.realName }]"/>
 

 

Invalid prop: type check failed for prop "maxLength". Expected Number with value 50, got String with value "50"

道具无效:道具“maxLength”类型检查失败。期望值为50的数字,得到值为“50”的字符串。

场景:使用a-input设置属性值maxLength报出的警告

解决:将 maxLength="50"改成 :maxLength="50"

<a-input placeholder="请输入管理员姓名"
         :maxLength="50"
         v-decorator="['realName',{ rules: [{ required: true, message: '管理员姓名不能为空' }],'initialValue':info.realName }]"/>
 

 2. form表单提交方法不执行问题,并且未报错

this.form.validateFields

表单中可能有未定义的变量

在使用ant Designd的 form 组件时发现点击提交方法中 this.props.form.validateFields((err, values) => {}) 部分未执行,也没有报错。

原因:我使用了自定义校验 validator ,在自定义校验方法中有个错误,使用了未定义的变量。

注意:

1、使用validator 时,注意自定义方法中是否有错误;对于如何解决没有错误提示,官网提示:可以选择通过 async 返回一个 promise 或者使用 try...catch进行错误捕获,具体查看官网form组件

2、使用validator 时,自定义方法中 callback 必须被调用

 

posted @ 2021-02-24 16:00  zhang305  阅读(1824)  评论(0编辑  收藏  举报