react使用antd表单赋值,用于修改弹框的操作


Posted in Javascript onOctober 29, 2020

1、使用getFieldDecorator的initialValue

react使用antd表单赋值,用于修改弹框的操作

2、在state里定义一个变量存表格的数据

react使用antd表单赋值,用于修改弹框的操作

3、给打开弹框的方法传个record

react使用antd表单赋值,用于修改弹框的操作

4、把表格里的值存到state

react使用antd表单赋值,用于修改弹框的操作

5、把在state里存的值传给弹框

react使用antd表单赋值,用于修改弹框的操作

6、获取传过来的值

react使用antd表单赋值,用于修改弹框的操作

7、在取消方法和修改成功后中给赋空值,要不然,点击添加的方法表单里面会有值

react使用antd表单赋值,用于修改弹框的操作

react使用antd表单赋值,用于修改弹框的操作

7、OK

react使用antd表单赋值,用于修改弹框的操作

补充知识:react中使用antd的表单重置数据

resetFields 重置一组输入控件的值(为 initialValue)与状态,如不传入参数,则重置所有组件 Function([names: string[]])

注:initialValue有值时会重置为initialValue

使用:

//这个事件,可以是click可以是生命周期函数,具体看需求
componentWillUnmount() { 
  this.props.form.resetFields(); //这是重置为默认值
  //在此进行相应操作
  console.log('值已经清空')
 }

以上这篇react使用antd表单赋值,用于修改弹框的操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 兼容firefox的一些问题
May 21 Javascript
6个DIV 135或246间隔一秒轮番显示效果
Jul 24 Javascript
JS中Iframe之间传值及子页面与父页面应用
Mar 11 Javascript
3种不同方式的焦点图轮播特效分享
Oct 30 Javascript
js获取url中"?"后面的字串方法
May 15 Javascript
JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)
Oct 17 Javascript
vue router下的html5 history在iis服务器上的设置方法
Oct 18 Javascript
VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
Jan 11 Javascript
详解Angular系列之变化检测(Change Detection)
Feb 26 Javascript
vue+iview动态渲染表格详解
Mar 19 Javascript
JS使用百度地图API自动获取地址和经纬度操作示例
Apr 16 Javascript
Vue2.x通用条件搜索组件的封装及应用详解
May 28 Javascript
node.js爬虫框架node-crawler初体验
Oct 29 #Javascript
JavaScript实现网页计算器功能
Oct 29 #Javascript
Javascript数组及类数组相关原理详解
Oct 29 #Javascript
antd Form组件方法getFieldsValue获取自定义组件的值操作
Oct 29 #Javascript
node.js如何操作MySQL数据库
Oct 29 #Javascript
TypeScript魔法堂之枚举的超实用手册
Oct 29 #Javascript
解决antd的Form组件setFieldsValue的警告问题
Oct 29 #Javascript
You might like
定制404错误页面,并发信给管理员的程序
2006/10/09 PHP
解析PHP 使用curl提交json格式数据
2013/06/29 PHP
PHP获取文件夹内文件数的方法
2015/03/12 PHP
PHP动态柱状图实现方法
2015/03/30 PHP
百度地图API使用方法详解
2015/08/25 PHP
ThinkPHP路由机制简介
2016/03/23 PHP
PHP中CheckBox多选框上传失败的代码写法
2017/02/13 PHP
js控制框架刷新
2008/08/01 Javascript
jquery.cookie用法详细解析
2013/12/18 Javascript
JavaScript函数的4种调用方法详解
2014/04/22 Javascript
JS判断当前页面是否在微信浏览器打开的方法
2015/12/08 Javascript
Bootstrap 手风琴菜单的实现代码
2017/01/20 Javascript
基于Vue.js 2.0实现百度搜索框效果
2020/12/28 Javascript
angular.js实现购物车功能
2017/10/23 Javascript
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
vue路由事件beforeRouteLeave及组件内定时器的清除方法
2018/09/29 Javascript
angularjs http与后台交互的实现示例
2018/12/21 Javascript
JS实现图片轮播效果实例详解【可自动和手动】
2019/04/04 Javascript
微信小程序表单验证插件WxValidate的二次封装功能(终极版)
2019/09/03 Javascript
解决layui的form里的元素进行动态生成,验证失效的问题
2019/09/14 Javascript
vux-scroller实现移动端上拉加载功能过程解析
2019/10/08 Javascript
使用axios发送post请求,将JSON数据改为form类型的示例
2019/10/31 Javascript
关于vue的列表图片选中打钩操作
2020/09/09 Javascript
[03:22]DAC最前线(第二期)—DOTA2亚洲邀请赛主赛场周边及线路探访
2015/01/24 DOTA
pyqt和pyside开发图形化界面
2014/01/22 Python
python实现中文转换url编码的方法
2016/06/14 Python
深入理解Python中的*重复运算符
2017/10/28 Python
Python random模块用法解析及简单示例
2017/12/18 Python
对python中两种列表元素去重函数性能的比较方法
2018/06/29 Python
详解Python最长公共子串和最长公共子序列的实现
2018/07/07 Python
Python绘制的二项分布概率图示例
2018/08/22 Python
django框架实现模板中获取request 的各种信息示例
2019/07/01 Python
车工岗位职责
2013/11/26 职场文书
上班早退检讨书
2014/01/09 职场文书
查环查孕证明
2014/01/10 职场文书
设计专业毕业生求职信
2014/06/25 职场文书