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. Java在常见的spring面试问题TOP50

    1. 一般问题 1.1. 不同版本的 Spring Framework 有哪些主要功能? Version Feature Spring 2.5 发布于 2007 年.这是第一个支持注解的版本. Spr ...

  2. 数学模块 math 函数的调用

    数学模块 math 模块名: math 注: linux下为内建模块 Mac OS下为标准库模块 数学模块用法: import math # 或 from math import * 数据 描述 ma ...

  3. 揭秘如何用Python黑掉智能锅炉

      引文 去年我买了一个新的冷凝式锅炉(家用取暖产品),于是考虑上面必须有一个“智能恒温器”,而选择也很多,包括Google Nest. Hive(英国天然气公司设计的) 以及伍斯特·博世‘Wave’ ...

  4. BAT脚本批量调用Sql执行文件 (SqlServer 数据库)

    @echo off & setlocal EnableDelayedExpansion set num=0set INSTANCE_HOSTNAME= 地址set INSTANCE_PORT= ...

  5. string::capacity string::size string::length string::max_size

    size_t capacity() const noexcept; #include <iostream>#include <string> using namespace s ...

  6. 移动端性能监控方案Hertz

    移动端性能监控方案Hertz 吴凯 瑞利 富强 徐宏 ·2016-12-19 16:10 性能问题是造成App用户流失的罪魁祸首之一.App的性能问题包括崩溃.网络请求错误或超时.响应速度慢.列表滚动 ...

  7. C# 将Excel以文件流转换DataTable

    /* *引用 NuGet包 Spire.XLS */ /// <summary> /// Excel帮助类 /// </summary> public class ExcelH ...

  8. cubemx+stm32串口学习汇总资料

    这篇文章是串口中断的文章--STM32基于CubeMX的高速串口收发程序(中断模式)比较有帮助. http://www.stmcu.org.cn/module/forum/thread-616613- ...

  9. CF732D Exams 二分 贪心

    思路:二分+贪心 提交次数:10次以上 错因:刚开始以为二分(边界,$+1or-1$)写错了,调了半天,后来才发现是$ck()$写错了.开始只判了最后是否小于零,而应该中间一旦小于零就$return\ ...

  10. 11.17 模拟赛&&day-2

    /* 后天就要复赛了啊啊啊啊啊. 可能是因为我是一个比较念旧的人吧. 讲真 还真是有点不舍. 转眼间一年的时间就过去了. 2015.12-2016.11. OI的一年. NOIP gryz RP++. ...