分类：Form组件

2021
04-27

React如何利用Antd的Form组件实现表单功能详解

一、构造组件1、表单一定会包含表单域，表单域可以是输入控件，标准表单域，标签，下拉菜单，文本域等。这里先引用了封装的表单域<Form.Item/>2、使用Form.create处理后的表单具有自动收集数据并校验的功能，但如果不需要这个功能，或者默认的行为无法满足业务需求，可以选择不使用Form.create并自行处理数据经过Form.create()包装过的组件会自带this.props.form属性，this.props.form提供了很多API来处理数据，如getFieldDecora... 继续阅读 >

2020
10-30

antd Form组件方法getFieldsValue获取自定义组件的值操作

自定义组件1、自定义组件被getFieldsValue包裹，会获得以下属性onChange方法,子组件调用此方法，可将值传给父组件，从而Form可拿到自定义组件的值value属性，获得初始值2、组件调用像Form表单内的组件一样调用，就可以了补充知识：AntDesignPro，用setFieldsValue方法，给嵌套到Form表单中的DatePicker或RangePicker组件设置默认值其实用setFieldsValue或者获取setState方法都可以设置DatePicker的默认值。但是关键点在于，引... 继续阅读 >

2020
10-30

解决antd的Form组件setFieldsValue的警告问题

记住：setFieldsValue的字段要对应得上解决antd的Form组件setFieldsValue的警告使用antd的Form组件setFieldsValue可能会出现Youcannotsetaformfieldbeforerenderingafieldassociatedwiththevalue.警告，字面意义去看是说在render之前设置了表单值的问题。解决在使用setFieldsValue给表单Form的某一个filed赋值时，可能掺杂了非表单控件中的字段，Form表单在赋值和渲染时发现有些字段无法渲染在现有的字段（因为不存... 继续阅读 >

2020
10-28

在react项目中使用antd的form组件,动态设置input框的值

问题：创建账号时，输入账号后不搜索直接保存，提示查询后，再点搜索就不能搜索这个账号了原因：点击保存之后，对表单进行了验证，导致之后请求的数据无法在更新到input框中，也就是说即使在state中有值，也不会更新initialValue值，就导致搜索后的值不能正确填入input中，表单也就提交不了。解决办法：不使用initialValue设置动态更新的值，而是使用this.props.form.setFieldValue({name:data});用于动态更新值，就可以解决了。... 继续阅读 >