初步理解 : initialValue就是所谓的defaultValue,只会在第一次赋值的时候改变,却又有一些不同,因为 initialValue又会因其他改动而改变。 然而当获取的数据重新上来要渲染的时候 ,initialValue的值却又不改变,所以 让人觉得很是捉摸不透。

解决:````this.props.form.resetFields();```

例:如果第一步操作执行的是修改操作,一些默认值填充上去,如果不作处理,第二部执行新增操作的时候,会把第一个默认的值带着,导致新增弹框弹出来的时候form表单中就是数值,效果体验特别不好,

后面发现在Modal文件里面添加componentWillReceiveProps中处理报表重置,就可以刷新form表单

componentWillReceiveProps(nextProps) {
if (!nextProps.modal.modalUpdateDetail) {
this.props.form.resetFields();
}

后来还是会在同样的坑里面跳 但这回不是在Modal里的Form,而是在类似TAB组件切换数据的时候,this.state的内容变了,但是render的initialValue还是保留着原来的数据 解决方法 1 我第一想到的是强制刷新,window.location.reload() 但这样的办法并不是理想的效果

2 治根还得治本,我知道是initialValue的问题 但如果参考原来的在componentWillReceiveProps里面重置表单数据,会出现其他各种问题,因为```componentWillReceiveProps``这个函数你可能因为别的原因触发了

componentWillReceiveProps(nextProps) {
if (!nextProps.modal.modalUpdateDetail) {
this.props.form.resetFields();
}

后来想着,既然是因为initialValue已经有了初始化,那在切换操作的时候,将它清除掉好了,所以在离开的操作函数里添加 了 this.props.form.resetFields();

作者:sbwxffnhc
链接:https://juejin.im/post/5c67e01651882562a12ad79b
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

antd中的form表单 initialValue导致数据不更新问题的更多相关文章

  1. Javascript中的Form表单知识点总结

    Javascript中的Form表单知识点总结 在HTML中,表单是由form元素来表示的,但是在javascript中,表单则由HTMLFormElement类型,此元素继承了HTMLElement ...

  2. django中的 form 表单操作

     form组件  1. 能做什么事?   1. 能生成HTML代码  input框   2. 可以校验数据   3. 保留输入的数据   4. 有错误的提示   1. 定义   from django ...

  3. 非form表单提交的数据就要用@requestbody注解获取http传过来的值,尤其json

    非form表单提交的数据就要用@requestbody注解获取http传过来的值,尤其json

  4. Django中的Form表单

    Django中已经定义好了form类,可以很容易的使用Django生成一个表单. 一.利用Django生成一个表单: 1.在应用下创建一个forms文件,用于存放form表单.然后在forms中实例华 ...

  5. 小程序 <web-view></web-view> 中使用 form 表单提交

    在最近的小程序项目中,使用到了 <web-view></web-view> 内嵌 H5 页面,在 H5 中需要使用 form 表单提交数据. H5 使用的技术框架是 vue+v ...

  6. Django中的Form表单验证

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

  7. Django 中的Form表单认证

    一.Form表单   1.1 Form的几个功能 验证用户数据(显示错误信息) 初始化页面显示内容 HTML Form提交保留上次提交数据 生成HTML标签   1.2 创建表单类Form 1. 创建 ...

  8. 第83天:jQuery中操作form表单

    操作form表单 1. 属性操作 设置属性: // 第一个参数表示:要设置的属性名称 // 第二个参数表示:该属性名称对应的值 $(selector).attr(“title”, “传智播客”); 获 ...

  9. javaWeb 中前端Form表单数据处理(手动拼json)

    在前端我们会用到最多的就是form表单提交数据,在form表单中有很多都是自动将数据传到后台,然后通过实体来接受的,但是有的时候我们就是需要在前端就拿到这个Form表单的数据,这是我们就可以自己讲数据 ...

随机推荐

  1. AT1980 [AGC001B] Mysterious Light 题解

    # 题意:高桥 くん 有一个边长为 N 的三枚镜子构成的正三角形 , 顶点为 a, b, c. 他有一个超级步枪 , 放在 AB 段的P点上,使得 AP=X . 并沿着平行于 BC 的方向发射一道光 ...

  2. Linux系统下安装tomcat

    一.前置条件 安装tomcat需要先安装jdk,所以没有安装jdk同学,详见参考文章 二.Linux上安装tomcat 1. 下载Apache tomcat tomcat官网下载地址 在左边,可以选择 ...

  3. 突出显示(Project)

    <Project2016 企业项目管理实践>张会斌 董方好 编著 当一个大的项目文件做好以后,查看全部内容,肉眼多少会有点吃不消,这时就需要"划重点".在Porect里 ...

  4. M语言的写、改、删(Power Query 之 M 语言)

    M语言基本上和其他语言一样,用敲键盘的方式写入.修改.删除,这个是废话. M语言可以在[编辑栏]或[高级编辑器]里直接写入.修改.删除,这个也是废话. M语言还有个地方可以写入.修改.删除,就是[自定 ...

  5. 当动态桌面遇上 HTML5

    DreamScene2 + HTML5 = 无限可能.时隔一周,DreamScene2 动态桌面经过几个小版本的迭代,修复了一些问题并且功能也得到了增强.欢迎 Star 和 Fork https:// ...

  6. 自己实现一个Electron跨进程消息组件

    我们知道开发Electron应用,难免要涉及到跨进程通信,以前Electron内置了remote模块,极大的简化了跨进程通信的开发工作,但这也带来了很多问题,具体的细节请参与我之前写的文章: http ...

  7. CF637B Chat Order 题解

    Content 有 \(n\) 个字符串,每次出现这个单词就把这个单词放到队列的队首(若已经出现就把原队列里面的那个单词提到队首),求最后的队列由队首到队尾的元素依次是多少. 数据范围:\(1\leq ...

  8. springboot使用线程池(ThreadPoolTaskExecutor)

    代码仓库:gitee 线程池创建 ` @Configuration @EnableAsync public class TaskPoolConfig { @Bean("syncExecuto ...

  9. JAVA微信支付——企业付款(企业向微信用户个人付款、转账)

    本地开发环境支付回调调试方法可以参考:https://www.cnblogs.com/pxblog/p/11623053.html 需要自行引入相关依赖 官方文档地址:https://pay.weix ...

  10. 【LeetCode】453. Minimum Moves to Equal Array Elements 解题报告(Java & Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 方法一:模拟过程 方法二:求和-n*最小值 方法三: ...