getFieldsError()方法其实只有required:true时,双向数据绑定。 {getFieldDecorator('note', { rules: [{ required: true, message: 'Please input your note!' }], })(<input/>)}

遇到一个需求,表单没有填写任何搜索条件搜索按钮置灰; 做法如下:

import React, { Component } from 'react';
import {Form, Input, Select, Row, Col, DatePicker, Checkbox, Spin,Button} from 'antd';
class componentName extends Component {
hasErrors =()=>{
const objKeys = Object.keys(fieldsError); const errArr = objKeys.filter(item => ['undefined', '', 'false'].includes('' + fieldsError[item])); return errArr.length >=14 ;
}
render() {
const {form: {getFieldDecorator, getFieldsValue}, advancedSearchOk,visiblebtn} = this.props;
return (
<div className={`${style.advanced_search_position_wrapper} ${visiblebtn ?style.wid90:''}`}>
<Form onSubmit={this.handleSubmit} onKeyDown={(e) => e.keyCode === 13 && advancedSearchOk()}>
<Row>
<Col span={18}>
<Form.Item {...formItemLayout3} label="关键字">
{getFieldDecorator('keyword', {
rules: [{required: false, message: '请输入关键字'}],
})(
<Input placeholder="多个条件请使用空格分开:客户ID/客户公司/集团" autoComplete="off"/>
)}
</Form.Item>
</Col>
{/* ....还有很多类似Form.Item */}
{visiblebtn?(<Col span={24}>
<div className='right'>
<Button onClick={this.handleFormReset}>重置</Button><Button style={{marginLeft: 8}} type="primary" onClick={this.handelResult} disabled={this.hasErrors(getFieldsValue())}>查询</Button>
</div>
</Col>):''}
</Row>
</Form>
</div>
)} } export default componentName;

关于antd form表单getFieldsError方法的更多相关文章

  1. jquery实现ajax提交form表单的方法总结

    本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一:  function AddHandlingFeeToRefund( ...

  2. jquery实现ajax提交form表单的方法总结(转)

    方法一: 复制代码 代码如下: function AddHandlingFeeToRefund() {            var AjaxURL= "../OrderManagement ...

  3. jQuery重置form表单的方法

    1  $("#formChangePwd")[0].reset();//清空表单元素的值 2  或直接用javascript代码操作 http://www.jb51.net/art ...

  4. django框架中form表单Post方法无法提交 Forbidden (403) CSRF verification failed. Request aborted.

    问题如图: 解决方法: 在视图函数中引入并使用装饰器 from django.views.decorators.csrf import csrf_exempt @csrf_exempt

  5. react + antd Form表单校验

    非空限制 {getFieldDecorator('name', { rules: [{ required: true, message: '名称不能为空', }],})( <Input plac ...

  6. js实现a标签超链接提交form表单的方法

    <a class="regButton"    id="saveRegister" onclick="document.getElementBy ...

  7. PHP通过get方法获得form表单数据方法总结

    下面给大家带来具体的代码示例: 1.form表单代码示例(表单get提交)   1 2 3 4 5 6 7 8 9 10 11 12 13 14 <head>   <meta cha ...

  8. js重置form表单

      CreateTime--2017年7月19日10:37:11Author:Marydon js重置form表单 需要使用的方法:reset() 示例: HTML部分 <form id=&qu ...

  9. react引用antd的form表单

    引用form是第三方插件ant插件,官网网址:https://ant.design/.用到的antd的版本是@2.0.1.form(https://ant.design/components/form ...

随机推荐

  1. Lua 学习之基础篇二<Lua 数据类型以及函数库 汇总>

    引言 前面讲了运算符,这里主要对Lua的数据处理相关的数据类型和函数库进行总结归纳,后面会再接着单独分开讲解具体使用. 首先因为Lua 是动态类型语言,变量不要类型定义,只需要为变量赋值. 值可以存储 ...

  2. [唐胡璐]Java操作Sql Server 2008数据库

    下载Microsoft JDBC Driver for SQL Server 直接去官网下载即可: 下载解压文件,得到sqljdbc.jar和sqljdbc4.jar。如果你使用的是jre1.7版本, ...

  3. vue1 计算属性

  4. Spring MVC + freemarker实现半自动静态化

    这里对freemarker的代码进行了修改,效果:1,请求.do的URL时直接生成对应的.htm文件,并将请求转发到该htm文件2,自由控制某个页面是否需要静态化原理:对org.springframe ...

  5. 推荐一款在IntelliJ IDEA中使用微信/QQ的插件

    SmartIM SmartIM4IntelliJ 是一个 IntelliJ IDEA 上的 SmartIM(原 SmartQQ)插件,可以在 IDEA 中使用 QQ 或微信聊天. 功能 收发文本消息 ...

  6. Task异步

    快速示例 class Program { static void Main(string[] args) { //Console.WriteLine("main start..") ...

  7. 文件和I/O

    一.读写文本数据 (1)使用open()函数配合rt模式读取文本文件的内容:( t 为默认的文本模式) (2)执行写入操作,使用wt模式,如果待操作文件已存在,会清除并覆盖其原先的内容: (3)对已存 ...

  8. [Luogu P1658] 购物

    题目链接 这道题的主要思想是贪心. 题目的要求用几个硬币将1~x的数都能够凑出的最少硬币个数.这里注意一下是都凑出而不是同时凑出. 先讨论什么时候无解.所有的自然数都可以用1堆砌而成.换而言之只要有1 ...

  9. 五十九.大数据、Hadoop 、 Hadoop安装与配置 、 HDFS

    1.安装Hadoop 单机模式安装Hadoop 安装JAVA环境 设置环境变量,启动运行   1.1 环境准备   1)配置主机名为nn01,ip为192.168.1.21,配置yum源(系统源) 备 ...

  10. tarjan模板(带注释)

    //dfsn[x]记录x节点有没有被访问过,有,则是第几个 //lowlink[x]记录x能到的祖先中编号最小的 //dfs_clock是个编号累计器 //scc记录一个 inline void df ...