解决ant Design中this.props.form.validateFields未执行的问题
在使用ant Designd的 form 组件时发现点击提交方法中 this.props.form.validateFields((err, values) => {}) 部分未执行，也没有报错。
原因：
我使用了自定义校验 validator ，在自定义校验方法中有个错误，使用了未定义的变量。
注意：
1、使用validator 时，注意自定义方法中是否有错误；对于如何解决没有错误提示，官网提示：可以选择通过 async 返回一个 promise 或者使用 try...catch进行错误捕获，具体查看官网form组件；
2、使用validator 时，自定义方法中 callback 必须被调用。
补充知识：ant design vue 表单域的validateFields取值和子item的change取值的先后问题
废话不多，先咔的撸出代码先
我先在created中初始化表单域form
然后在表单域子节点中绑定@change="handleChange"函数，
然后我设想是每一次单选完后打印出单选后的值
然而结果是每次打印的值是单选前的值，比如：
我开始时默认选正常，第一次选异常，打印出正常
第二次选正常，结果打印出异常
我懵逼了，一般出现这种情况应该是跟事件机制同步或者异步的先后顺序有关，于是仔细设置了validateFields为异步输出
这回输出正常了，
果然是，个人猜测是输入框的change事件赋值发生在表单域的validateFields（）事件之后，导致取到的值是修改前的值
以上这篇解决ant Design中this.props.form.validateFields未执行的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了elementUI踩坑记录-el-table问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-08-08
vue结合el-table实现表格行拖拽排序(基于sortablejs)
这篇文章主要介绍了vue结合el-table实现表格行拖拽排序(基于sortablejs),本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2024-01-01
这篇文章主要介绍了vue中的虚拟dom知识点总结，文章围绕主题内容展开详细介绍，需要的小伙伴可以参考一下，希望对你的学习有所帮助2022-04-04
在开发Vue应用时,我们经常需要在多个组件中复用一些通用的函数或方法,这些函数可能是我们自己编写的工具函数,也可能是从第三方库中导入的,下面我们就来看看如何正确引用和使用外部方法吧2024-01-01
这篇文章主要为大家详细介绍了vue富文本编辑器组件vue-quill-edit的使用教程，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-09-09
Vant是一个专为移动端设计的轻量级组件库,自2017年开源以来,提供了Vue2、Vue3及多平台版本支持,安装Vant时需要注意版本兼容问题,Vue3项目应安装最新版Vant3,而Vue2项目则需安装Vant2,安装错误时,需卸载后重新安装正确版本2024-10-10
这篇文章主要介绍了在Vue和React中如何优雅地使用loading，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
在Vue中,有两种常用的CSS选择器,用于修改组件样式：scoped 和 /deep/（或 ::v-deep）,它们都是为了实现样式的作用域,本文小编就来分别给大家介绍一下这两种选择器的原理,需要的朋友可以参考下2023-08-08
vue-devtools 开发工具插件之支持vue3 chrome 浏览器插件
这篇文章主要介绍了vue-devtools 开发工具插件之支持vue3 chrome 浏览器插件,用这个版本主要是为了支持vue3 推荐直接下载，文中给大家提供了下载地址，感兴趣的朋友跟随小编一起看看吧2022-01-01
下面小编就为大家分享一篇搭建element-ui的Vue前端工程操作实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-02-02
最新评论