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表单的数据,这是我们就可以自己讲数据 ...
随机推荐
- 【C/C++】函数的分文件编写
创建同名的头文件(.h)和cpp文件. 在头文件里写函数声明,在cpp文件中写函数定义. 在cpp文件中写#include "xx.h" //自定义头文件名 框架(include ...
- Delphi编译报错对照表
';' not allowed before 'ELSE' → ElSE前不允许有";" " clause not allowed in OLE automation s ...
- uniapp实现钉钉扫码登录
由于uniapp暂无钉钉授权登录所以本文将钉钉扫码登录作为网页嵌入uniapp,最终实现钉钉扫码登录app 1. 用H5调起钉钉扫码登录 钉钉在网页端的扫码登录可参考钉钉文档:扫码登录第三方网站 - ...
- Nginx HTTP块配置
1 配置块的嵌套 http { upstream {...} split_clients {...} map {...} geo {...} server { if () {...} location ...
- 学习笔记--html篇(1)
html学习--1 href学习 href="javascript:void(0)" 阻止页面跳转类似于javascript:#,url无变化(死链接,返回undefined) h ...
- ios获取文件MD5值
一般我们在使用http或者socket上传或者下载文件的时候,经常会在完成之后经行一次MD5值得校验(尤其是在断点续传的时候用的更 多),校验MD5值是为了防止在传输的过程当中丢包或者数据包被篡改,在 ...
- django - Templates模板嵌套语法
模板继承 1.继承母板:{% extends '母板html文件名称' %} 2.包含子模板:{% include '子母板html 文件名' %} 模板内容分块 {% block <分块名& ...
- PowerDotNet平台化软件架构设计与实现系列(09):消息平台
消息队列已经几乎成为大中型高吞吐应用的标配,继续根据我们一贯的节约代码的风格,为了复用的目标,抽象出消息队列平台,进行消息队列管理. 环境准备 1.(必须).Net Framework4.5+ 2.( ...
- Spring学习(四)在Web项目中实例化IOC容器
1.前言 前面我们讲到Spring在普通JAVA项目中的一些使用.本文将介绍在普通的Web项目中如何实例化Spring IOC容器.按照一般的思路.如果在Web中实例化Ioc容器.这不得获取Conte ...
- ubuntu ffmpeg 转码错误
[aac @ 0xde2400] The encoder 'aac' is experimental but experimental codecs are not enabled, add '-st ...