import  React  from  'react';
import  {Form,Input,Select,Button ...}  from  'antd';

class  PageName  extends  React.Component{
         render(){
              const  {getFieldDecorator}  = this.props.form;
              return(
                  <Form>
                       <Form.Item  label='姓名'>
                            {
                              getFieldDecorator(
                                  'name',{
                                     rules:[
                                     {required:true,message:'请输入姓名'}
                                     ]
                                  }
                              )                              (<Input></Input>)
                            }
                       </Form.Item>
                  </Form>
          )
    }
}  

export  default  Form.create()(PageName)

官方文档:
form.create:  https://github.com/react-component/form#note-use-wrappedcomponentref-instead-of-withref-after-rc-form140                            

当时用了form.create包装后的组件,会自带 this.props.form 属性

参见文档:https://ant.design/components/form-cn/

antDesign 使用Form并进行表单验证的更多相关文章

  1. python_way day19 HTML-day5 (form表单验证,CSRF,cookie,session,缓存)

    python-way day19 1. dJango的form表单验证 2.CSRF 跨站请求伪造 3.cookie,session 4.缓存 一,django表单验证功能 1.django验证基础: ...

  2. jquery validate表单验证插件-推荐

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  3. 走进AngularJs 表单及表单验证

    年底了越来越懒散,AngularJs的学习落了一段时间,博客最近也没更新.惭愧~前段时间有试了一下用yeoman构建Angular项目,感觉学的差不多了想做个项目练练手,谁知遇到了一系列问题.yeom ...

  4. validate表单验证插件

    1.引入validate.js包 <script src="xx/xx/jquery.validate.min.js"></script> 2.表单验证 / ...

  5. jquery validate表单验证插件

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  6. 走进AngularJs(九)表单及表单验证

    年底了越来越懒散,AngularJs的学习落了一段时间,博客最近也没更新.惭愧~前段时间有试了一下用yeoman构建Angular项目,感觉学的差不多了想做个项目练练手,谁知遇到了一系列问题.yeom ...

  7. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  8. jquery validate表单验证插件的基本使用方法及功能拓展

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.    1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素 3.鼠标离开后的正确.错误提示及鼠标移入时的帮助提 ...

  9. vue 常用的表单验证,包括手机号码,固定电话和身份证...

    <template> <div> <pl-content-box> <pl-page-nav :show-previous=true></pl-p ...

随机推荐

  1. 虚拟机克隆后无法上网的解决(Centos7为例)

    说明:我的虚拟机之前配置的为静态ip 解决步骤: (1)更换mac地址 (2)删除 etc/udev/rules.d/70-persistent-net.rules 删除后重启机器,系统会自动生成一个 ...

  2. Ubuntu 16.04下安装MySQL5.7

    原文链接:https://www.linuxidc.com/Linux/2017-06/144805.htm ps:ubuntu14.04下默认安装的是MySQL5.5 首先执行下面三条命令: sud ...

  3. python基础-----类和实例

    在python中,首字母大写的名称指的是类,这个类定义中括号的内容是空的. 面向对象最重要的概念就是类(Class)和实例(Instance),必须牢记类是抽象的模板而实例是根据类创建出来的一个个具体 ...

  4. C++ std::pair的用法

    1 pair的应用 pair是将2个数据组合成一个数据,当需要这样的需求时就可以使用pair,如stl中的map就是将key和value放在一起来保存.另一个应用是,当一个函数需要返回2个数据的时候, ...

  5. C++以const 作为返回值类型的意义

    const rational operator*(const rational& lhs, const rational& rhs); 很多程序员第一眼看到它会纳闷:为什么operat ...

  6. 【Linux】CentOS7.0下安装JDK环境

    写在前面:此次试验是在CentOS7上面安装的,亲测成功. 所需工具:JDK1.8安装包,xftp 具体步骤: 1,首先使用xftp连接到自己的虚拟机,然后查看是否有"/usr/java/j ...

  7. hdfs命令get或者put提示找不到目录或文件

    今天用hdfs命令出现个诡异情况: hadoop fs -put a.txt /user/root/ put: `a.txt': No such file or directory 用get命令存在相 ...

  8. shiro登录验证原理

    这段时间有点忙,没咋写博客,今天打开staruml看到以前画的一张shiro原理图,先在这发一下,空了再好好进行分析.

  9. 深入理解 sudo 与 su 之间的区别【转】

    深入理解 sudo 与 su 之间的区别 两个命令的最大区别是: sudo 命令需要输入当前用户的密码,su 命令需要输入 root 用户的密码.另外一个区别是其默认行为.sudo 命令只允许使用提升 ...

  10. C# string.join

    String.Join 方法 平常工作中经常用到string.join()方法,在vs 2017用的运行时(System.Runtime, Version=4.2.0.0)中,共有九个(重载)方法. ...