antd中的form表单 initialValue导致数据不更新问题
初步理解 : 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导致数据不更新问题的更多相关文章
- Javascript中的Form表单知识点总结
Javascript中的Form表单知识点总结 在HTML中,表单是由form元素来表示的,但是在javascript中,表单则由HTMLFormElement类型,此元素继承了HTMLElement ...
- django中的 form 表单操作
form组件 1. 能做什么事? 1. 能生成HTML代码 input框 2. 可以校验数据 3. 保留输入的数据 4. 有错误的提示 1. 定义 from django ...
- 非form表单提交的数据就要用@requestbody注解获取http传过来的值,尤其json
非form表单提交的数据就要用@requestbody注解获取http传过来的值,尤其json
- Django中的Form表单
Django中已经定义好了form类,可以很容易的使用Django生成一个表单. 一.利用Django生成一个表单: 1.在应用下创建一个forms文件,用于存放form表单.然后在forms中实例华 ...
- 小程序 <web-view></web-view> 中使用 form 表单提交
在最近的小程序项目中,使用到了 <web-view></web-view> 内嵌 H5 页面,在 H5 中需要使用 form 表单提交数据. H5 使用的技术框架是 vue+v ...
- Django中的Form表单验证
回忆一下Form表单验证的逻辑: 前端有若干个input输入框,将用户输入内容,以字典传递给后端. 后端预先存在一个Form表单验证的基类,封装了一个检测用户输入是否全部通过的方法.该方法会先定义好错 ...
- Django 中的Form表单认证
一.Form表单 1.1 Form的几个功能 验证用户数据(显示错误信息) 初始化页面显示内容 HTML Form提交保留上次提交数据 生成HTML标签 1.2 创建表单类Form 1. 创建 ...
- 第83天:jQuery中操作form表单
操作form表单 1. 属性操作 设置属性: // 第一个参数表示:要设置的属性名称 // 第二个参数表示:该属性名称对应的值 $(selector).attr(“title”, “传智播客”); 获 ...
- javaWeb 中前端Form表单数据处理(手动拼json)
在前端我们会用到最多的就是form表单提交数据,在form表单中有很多都是自动将数据传到后台,然后通过实体来接受的,但是有的时候我们就是需要在前端就拿到这个Form表单的数据,这是我们就可以自己讲数据 ...
随机推荐
- JSP中声明变量、方法
在JSP页面中声明局部变量,全局变量,方法等 代码示例: <%@ page language="java" contentType="text/html; char ...
- 8、Redis五大数据类型---哈希(Hash)
一.哈希(Hash)简介: Redis hash 是一个string类型的field和value的映射表,hash特别适合用于存储对象. Redis hash 是一个键值对集合. 二.常用命令 1.h ...
- [BUUCTF]PWN——铁人三项(第五赛区)_2018_rop
铁人三项(第五赛区)_2018_rop[32位libc泄露] 题目附件 解题步骤: 例行检查,32位,开启了NX保护 试运行一下程序,一开始让我们输入,然后直接输出"Hellow,world ...
- 【web】sqli-labs学习
第一页 1~4预备知识(基于错误的注入) 几个常用函数: 1. version()--MySQL 版本 2. user()--数据库用户名 3. database()--数据库名 4. @@dat ...
- 听听文档(视频)-Power Pivot
打开微信扫描二维码
- 【死磕Java并发】-----内存模型之happens-before
在上篇博客([死磕Java并发]-----深入分析volatile的实现原理)LZ提到过由于存在线程本地内存和主内存的原因,再加上重排序,会导致多线程环境下存在可见性的问题.那么我们正确使用同步.锁的 ...
- JSR310-LocalDateTime序列化 & 反序列化
问题 springboot 版本:spring-boot 2.3.12 今天在开发一个redis 热key服务端的过程中,碰到2个问题: jdk8的LocalDateTime,LocalDate,Lo ...
- ACwing2.01背包问题
题目: 有 N 件物品和一个容量是 V 的背包.每件物品只能使用一次. 第 i 件物品的体积是 vi,价值是 wi. 求解将哪些物品装入背包,可使这些物品的总体积不超过背包容量,且总价值最大. 输出最 ...
- JAVA上传文件到FTP上
添加maven <!-- https://mvnrepository.com/artifact/commons-net/commons-net --> <dependency> ...
- RPA培训:RPA的核心三个组件常见部署方式(RPA学习天地)
整体架构 目前主流厂商的RPA平台就是由控制台.设计器和机器人这三个标准套件组成,这三个核心套件形成了RPA产品的基本要素.其它如AI平台.人机交互.流程挖掘.自动化中心等都是衍生出来的周边产品. 1 ...