1、复现:用antd的Form表单验证上传图片必填项时出现问题:复现过程,先提交,提示图片需要上传,上传成功后,依旧提示:图片未上传

2、表单验证原理:先理解一下antd的Form表单验证的表层原理,每个表单getFieldDecorator配置项都有个名字,比如就叫goodsSkuImg,这个goodsSkuImg对应this.props.form.goodsSkuImg如果为空则验证不通过。

3、结论:Form提示的根本原因是this.props.form.goodsSkuImg值为空

4、解决方案:

在上传时调用如下

this.props.form.setFieldsValue({
goodsSkuImg: [{
uid: publicUrl,
name: file.name,
status: 'done',
url: publicUrl,
}]
});

此时this.props.form.goodsSkuImg就不为空验证通过

5、注意:在移出图片的方法中也需要调用

this.props.form.setFieldsValue({
goodsSkuImg: undefined
});

使得this.props.form.goodsSkuImg为空,表单验证不通过

ant-pro使用Form表单验证上传图片出现的问题的更多相关文章

  1. element-ui Form表单验证

    element-ui Form表单验证规则全解 element的form表单非常好用,自带了验证规则,用起来很方便,官网给的案例对于一些普通场景完全没问题,不过一些复杂场景的验证还得自己多看文档摸索, ...

  2. form表单验证-Javascript

    Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...

  3. django之form表单验证

    django中的Form一般有两种功能: 输入html 验证用户输入 #!/usr/bin/env python # -*- coding:utf- -*- import re from django ...

  4. python_way day19 HTML-day5 (form表单验证,CSRF,cookie,session,缓存)

    python-way day19 1. dJango的form表单验证 2.CSRF 跨站请求伪造 3.cookie,session 4.缓存 一,django表单验证功能 1.django验证基础: ...

  5. form表单验证2

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Day19 Django之Form表单验证、CSRF、Cookie、Session和Model操作

    一.Form表单验证 用于做用户提交数据的验证1.自定义规则 a.自定义规则(类,字段名==html中的name值)b.数据提交-规则进行匹配代码如下: """day19 ...

  7. [php基础]PHP Form表单验证:PHP form validator使用说明

    在PHP网站开发建设中,用户注册.留言是必不可少的功能,用户提交的信息数据都是通过Form表单提交,为了保证数据的完整性.安全性,PHP Form表单验证是过滤数据的首要环节,PHP对表单提交数据的验 ...

  8. django form表单验证

    一. django form表单验证引入 有时时候我们需要使用get,post,put等方式在前台HTML页面提交一些数据到后台处理例 ; <!DOCTYPE html> <html ...

  9. Django中的Form表单验证

    回忆一下Form表单验证的逻辑: 前端有若干个input输入框,将用户输入内容,以字典传递给后端. 后端预先存在一个Form表单验证的基类,封装了一个检测用户输入是否全部通过的方法.该方法会先定义好错 ...

随机推荐

  1. MVP架构的一个小例子

    主角: MVP是一种编程的架构模式,M=Model,负责提供数据:V=View,负责显示数据:P=Presenter,负责处理数据. 应用例子: csharp写的一个qq机器人. 一.Model层 获 ...

  2. java 使用POI导出百万级数据

    先看结果吧,这只是测试其中有很多因数影响了性能. 表总数为:7千多万,测试导出100万 表字段有17个字段 最终excel大小有60多兆 总耗时:126165毫秒 差不多2分多钟 其核心简单来说就是分 ...

  3. 解决IDEA提示Untrusted Server's certificate 证书不可用( Server's certificate is not trusted )

    Untrusted Server's certificate 如果你用的是Intellij系列IDE(GoLand, PHPStorm, WebStorm, IDEA),突然弹出个提示『Untrust ...

  4. linux在配置菜单中添加选项

  5. Vsftpd Nginx

    Linux(CentOS-6.10)下安装Vsftpd Nginx 1:创建FTP专属的账户和密码[root@localhost ~]# useradd ftpuser[root@localhost ...

  6. python文件操作:字符编码与文件处理

    一.字符编码 二.文件处理 一.字符编码 储备知识点: 1. 计算机系统分为三层: 应用程序 操作系统 计算机硬件 2. 运行python程序的三个步骤 1. 先启动python解释器 2. 再将py ...

  7. OSI七层协议和TCP/IP四层协议

    1. OSI七层和TCP/IP四层的关系 1.1 OSI引入了服务.接口.协议.分层的概念,TCP/IP借鉴了OSI的这些概念建立TCP/IP模型. 1.2 OSI先有模型,后有协议,先有标准,后进行 ...

  8. HTML嵌入多媒体对象

    [问题描述]如何在HTML中嵌入pdf.word,音频(如mp3),视频(如mp4),flash呢? [分析] 1 嵌入pdf (1) 利用object <object classid=&quo ...

  9. Codeforces Round #455 (Div. 2) 909E. Coprocessor

    题 OvO http://codeforces.com/contest/909/problem/E CF455 div2 E CF 909E 解 类似于拓扑排序地进行贪心, 对于 Ei=0 并且入度为 ...

  10. 【Wince-USB通讯】Wince在没有Wifi的情况下使用USB数据线与PC进行Socket通讯

    具体操作 1.确保Wince连接PC成功 2.服务端的IP输入:127.0.0.1 ,然后启动侦听. 3.在客户端输入的服务器IP是:192.168.55.100 (客户端的IP是192.168.55 ...