React Antd form.getFieldsValue() 和 form.getFieldsValue(true) 有区别吗？

最新推荐文章于 2024-11-16 21:52:49 发布
最新推荐文章于 2024-11-16 21:52:49 发布
阅读量2k 收藏 1
点赞数
分类专栏： 前端 文章标签： react.js 前端 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Constantiny/article/details/132474749
版权
探讨了 React Antd 中 form.getFieldsValue 方法的不同用法，特别是传入 true 参数时的区别。getFieldsValue 不传参数时返回所有注册字段，传入 true 则获取 store 中包括未注册字段的所有值，而传入数组则按路径获取特定值。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

背景

突然发现 antd 的 getFieldsValue()是可以传一个 true 参数的，如题,React Antd form.getFieldsValue() 和 form.getFieldsValue(true) 有区别吗？

验证

确实不一样
在这里插入图片描述
在这里插入图片描述

结论

getFieldsValue 提供了多种重载方法：

getFieldsValue(nameList?: true | NamePath[], filterFunc?: FilterFunc)
当不提供 nameList 时，返回所有注册字段，这也包含 List 下所有的值（即便 List 下没有绑定 Item）。

当 nameList 为 true 时，返回 store 中所有的值，包含未注册字段。例如通过 setFieldsValue 设置了不存在的 Item 的值，也可以通过 true 全部获取。

当 nameList 为数组时，返回规定路径的值。需要注意的是，nameList 为嵌套数组。例如你需要某路径值应该如下：
在这里插入图片描述

「已解决」React Antd Form.List 表单校验无飘红提示的问题
Constantiny的博客
07-27 2758
比如我有这样一段代码来实现对 list 具体内容的校验，但是写完后发现没有提示，打 console.log 发现也能进入到 throw new Error 里面去，但是就是没有飘红提示。我想对 Form.List 构建的表单进行校验，比如下拉框中的内容应当至少有一个 XX，表单的长度不能少于多少等等对 List 内容进行校验，并给出飘红提示。看官网，对 Form.list 整体进行校验需要加上 ErrorList 才能正常显示 飘红提示。
记录antd表单组件的Form.List的一个使用场景 如何自定义一个新的Form表单组件
nihaoljs的博客
07-12 3132
antd 表单
antd Form组件方法getFieldsValue获取自定义组件的值操作
01-18
自定义组件 1、自定义组件被getFieldsValue包裹，会获得以下属性 onChange方法, 子组件调用此方法，可将值传给父组件，从而Form可拿到自定义组件的值 value属性，获得初始值 2、组件调用 像Form表单内的组件一样调用，就可以了 补充知识：Ant Design Pro，用setFieldsValue方法，给嵌套到Form表单中的DatePicker或RangePicker组件设置默认值 其实用setFieldsValue或者获取setState方法都可以设置DatePicker的默认值。 但是关键点在于，引用moment方法转换日期格式 1、setState方法
antd form.getFieldsValue(true)用法
Erya Programming learning
09-09 5736
在form组件中手动推入一个自定义属性，并获取
antd form表单的getFieldDecorator，validateFields，getFieldValue，setFieldsValue用法
续得木槿的博客
04-16 8687
1.getFieldDecorator getFieldDecorator是一个方法，这个方法接收两个参数，第一个是表单的字段对象，第二个是验证规则。这个方法本身返回一个方法，需要将需要获取值的标签包裹进去。 <From> <Form.Item label="月份："> {getFieldDecorator('summaryDate', { initialValue: '', rules: [{ required: true, message
antd 表单通过form.getFieldsValue获取不全tabs组件下表单数据的问题
程展威的博客
10-24 3032
解决获取tabs下表单不全问题
antd的select的defaultValue通过form.getFieldsValue获取不到
我不写文章，我只是文章的搬运工
06-13 799
如果你希望在组件挂载后立即获取表单字段的值，可以在组件的。：如果你的默认值是异步获取的，确保在设置默认值后再渲染。组件已经初始化完成，并且所有字段都已经注册到表单中。确保你已经正确设置了这些属性。在使用Ant Design（简称antd）的。组件是一个受控组件，这意味着你需要使用。，这样在表单初始化时就会使用这个值。，可能会遇到一些问题。组件中，你可以设置每个字段的。组件的受控属性更新有关。：如果你在表单外部更改了。方法注册到表单中的，这样。组件时，如果你希望使用。
使用react+antd3开发的复杂、超大数据量级的form表单
weixin_57185351的博客
02-28 2400
本方案肯定不是最佳实践，从产品层面到代码层面都有优化的空间。因为当时在需求评审时，由于疏忽，没有和pm确认该页面的数据量级，以至于在提测之后才知道该页面需要承载的压力之大，所以各方均没有时间再做大量的改造，只能从现有的代码上尽力做下优化。一个嵌套了多个子层级，每一个层级均具有动态增、删、上移、下移、复制功能的form表单，且该表单也支持回显编辑再提交。面对这种大数据量的表单功能，开发时应该注意：1.细化form表单结构；2.细化数据；3.增加判断或使用hooks，减少不必要的重复渲染。
antd中的Form、FormItem、FormList、FormList + Table详解
hole_diss的博客
11-16 2136
Form是高性能表单控件，自带数据域管理。包含数据录入、校验以及对应样式。
react 父子传值_React学习——通过模态框中的表单学习父子组件之间传值
weixin_29246195的博客
12-30 520
import { button, modal, form, input, radio } from 'antd';const collectioncreateform = form.create({ name: 'form_in_modal' })(// eslint-disable-next-lineclass extends react.component {render() {const {...
useEffect 通过 form.getFieldValue(‘xxx‘) 监听 Form表单变化
二三的博客
03-08 5529
Form 内置方法，不是响应式的（即不是一个state），由其设置或者获取的值，不会触发UI更新，只能对变更的field进行刷新。想要对其进行监听也很简单，将其变成一个state即可。
react学习(61)-antdesign 中getFieldValue
歌谣的博客
07-27 1392
handleSubmit = e => { const { dispatch } = this.props; e.preventDefault(); var date_juban = this.props.form.getFieldValue('date_juban'); this.state.open_time_start = date_juban[0]; this.state.open_time_end = date_juban[1]; if ...
Vue组件学习相关
冰谷悠
10-13 252
组件相关知识 ①组件注册：变量名大小写不敏感，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名)，如： Vue.component('blog-post', { props: ['postTitle'], // 在 JavaScript 中是 camelCase template: '<h3>{{ postTitle }}</h3>' }) <!-- 在 HTML 中是 kebab-case--> &lt
[React] Antd Form getFieldValue 的使用、DatePicker 禁用日期 disabledDate
iChangebaobao的博客
06-06 3083
在表单中，有时需要根据表单项的不同选择，对下面的表单项进行不同的显示，也就是说，后面的表单项依赖于前面的表单项，这时是可以使用getFieldValue 获取依赖项的值进行判断，从而显示不同的内容 比如上面代码，当审核不通过原因选择其他时，显示一个 让用户填写 Antd 日期组件的选择比如某个表单项，只能选择某个日期之后的日期.........
antd vue 表单中getFieldDecorator、getFieldValue、setFieldValue用法
weixin_50367873的博客
10-13 4314
ant design of vue form表单 Ant Design 表单中getFieldDecorator、getFieldValue、setFieldValue用法
antd getFieldValue()参数值取决于
qq_44871531的博客
05-30 2244
如果你想获取form表单的某个a-form-item的值，可以通过getFieldValue()，通过设置参数列如：getFieldValue([‘uids’])获取数组，通过ds调用值，a-form-item 的key可以绑定多个字段，你要是想在getFieldValue([‘uids’])[“ds”]获取你想要的值，只需要在：:key=“item.xxx”,把xxx设置成你想要的字段即可 ...
react 踩坑----this.props.form.getFieldValue()获取不到输入的值
热门推荐
Seeyoucm
04-11 2万+
this.props.form.getFieldValue()获取不到输入的值
React 知识汲取篇 —— Ant Design 表单中getFieldDecorator、getFieldValue、setFieldValue用法
风华流沙君莫笑的博客
12-02 3053
Ant Design 表单中getFieldDecorator、getFieldValue、setFieldValue用法 一、getFieldDecorator getFieldDecorator是一个方法，这个方法接收两个参数，第一个是表单的字段对象，第二个是验证规则。这个方法本身返回一个方法，需要将需要获取值的标签包裹进去 <From> <FormItem> //JS代码书写时需要用 { } 包裹起来，不能直接写在代码块中 {
react-antd的form.getFieldsValue()获取不到select下拉框默认值的问题
qq_51175166的博客
01-18 1231
刚开始我是在select中设置了defaultvalue=“空闲”，选项框select能显示默认值，但发现不选择select的选项(不点，直接提交),发现form.getFieldsValue()获取的值为空，最后用initialValue解决了问题。const selectData = [{ key: '1', value: '空闲',label:'空闲' }, { key: '2', value:'有货',label: '有货' }]
antd form.list 增加form
最新发布
01-15
import { Form, Input, Button } from 'antd'; const DynamicFormItemExample = () => { const layout = { labelCol: { span: 8 }, wrapperCol: { span: 16 }, }; return ( <Form name="dynamic_form_item" ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

zoe_ya

如果你成功申请，可以打赏杯奶茶

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值