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常用的弹出广告及背投广告实现方法
Feb 06 Javascript
跟我学习javascript的arguments对象
Nov 16 Javascript
详解jquery事件delegate()的使用方法
Jan 25 Javascript
js利用appendChild对标签进行排序的实现方法
Oct 16 Javascript
简单理解vue中track-by属性
Oct 26 Javascript
原生js代码实现图片放大境效果
Oct 30 Javascript
JavaScript中的遍历详解(多种遍历)
Apr 07 Javascript
用 Vue.js 递归组件实现可折叠的树形菜单(demo)
Dec 25 Javascript
vue项目添加多页面配置的步骤详解
May 22 Javascript
jquery实现两个div中的元素相互拖动的方法分析
Apr 05 jQuery
微信小程序连续签到7天积分获得功能的示例代码
Aug 20 Javascript
js正则匹配markdown里的图片标签的实现
Mar 24 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
C# Assembly类访问程序集信息
2009/06/13 PHP
PHP中用正则表达式清除字符串的空白
2011/01/17 PHP
php模拟js函数unescape的函数代码
2012/10/20 PHP
php配合jquery实现增删操作具体实例
2013/12/12 PHP
php多次include后导致全局变量global失效的解决方法
2015/02/28 PHP
Ajax中的JSON格式与php传输过程全面解析
2017/11/14 PHP
很可爱的输入框
2008/08/03 Javascript
JQuery中的$.getJSON 使用说明
2011/03/10 Javascript
6款经典实用的jQuery小插件及源码(对话框/提示工具等等)
2013/02/04 Javascript
jquery $.trim()方法使用介绍
2014/05/21 Javascript
jQuery实现tag便签去重效果的方法
2015/01/20 Javascript
jQuery使用empty()方法删除元素及其所有子元素的方法
2015/03/26 Javascript
微信小程序 label 组件详解及简单实例
2017/01/10 Javascript
vue.js 获取当前自定义属性值
2017/06/01 Javascript
详解vue-cli快速构建vue应用并实现webpack打包
2017/12/13 Javascript
细说webpack源码之compile流程-rules参数处理技巧(2)
2017/12/26 Javascript
js判断传入时间和当前时间大小实例(超简单)
2018/01/11 Javascript
微信小程序实现之手势锁功能实例代码
2018/07/19 Javascript
vue vue-Router默认hash模式修改为history需要做的修改详解
2018/09/13 Javascript
vue实现移动端项目多行文本溢出省略
2020/07/29 Javascript
[01:35]2018年度CS GO最佳战队-完美盛典
2018/12/17 DOTA
python list中append()与extend()用法分享
2013/03/24 Python
TensorFlow实现创建分类器
2018/02/06 Python
python中abs&map&reduce简介
2018/02/20 Python
python 文件查找及内容匹配方法
2018/10/25 Python
Python3最长回文子串算法示例
2019/03/04 Python
python挖矿算力测试程序详解
2019/07/03 Python
有关Tensorflow梯度下降常用的优化方法分享
2020/02/04 Python
Python3 用什么IDE开发工具比较好
2020/11/28 Python
美国领先的在线邮轮旅游公司:CruiseDirect
2018/06/07 全球购物
科技开发中心办公室主任岗位责任制
2014/02/10 职场文书
省级优秀毕业生主要事迹
2014/05/29 职场文书
普通话演讲稿
2014/09/03 职场文书
华清池导游词
2015/02/02 职场文书
装饰技术负责人岗位职责
2015/04/13 职场文书
Mysql 性能监控及调优
2021/04/06 MySQL