使用 ant design 提供的 getFieldDecorator 进行验证

一般开始使用默认选中

<FormItem>
{getFieldDecorator('checkProtocol', {
valuePropName: "checked",
initialValue: true,
rules: [{ required: true, message: '请同意,我已经阅读并接受' }],
})(
<CheckboxGroup defaultValue={'我已经阅读并接受' } options = {
[{
label: '我已经阅读并接受' ,
value: '我已经阅读并接受'
}]
} />
)}
</FormItem>

React 项目 ant design 的 CheckboxGroup 验证的更多相关文章

  1. react的ant design的UI组件库

    PC官网:https://ant.design/ 移动端网址:https://mobile.ant.design/docs/react/introduce-cn antd-mobile :是 Ant ...

  2. react使用ant design pro时的滑动图片组件

    react的滑动图片验证,是基于https://segmentfault.com/a/1190000018309458?utm_source=tag-newest做的修改,改动的主要有以下几点: 1. ...

  3. React +Redux+ Ant Design + echarts 项目实践

    项目框架 采用React.js作为项目的框架 采用redux作为数据管理的框架 采用antd作为项目的UI组件 采用echarts完成项目中折线图的绘制 个人项目工作流程总结 拿到UI高保真图片之后先 ...

  4. ant Design表单验证笔记

    1.pattern正则验证 <Col md={12} sm={24}> <FormItem {...formItemLayout} label="班数"> ...

  5. react ,ant Design UI中table组件合并单元格并展开详情的问题

    需求:购物车订单列表,如图: 一:单元格合并 遇到这种你会怎么办呢?  单元格合并?  还是其他的方法? 下面是我的处理方式,就是在table 组件的columns上处理,这里拿商品举例,其余的类似, ...

  6. React之ant design的table表格序号连续自增

    render(text,record,index){     return(       <span>{(pagination.current-1)*10+index+1}</spa ...

  7. Ant Design 使用小结

    最近公司做了一个系统,因为页面涉及的表单交互非常多,如果使用之前的 Node + Express 的开发模式效率是非常低的,因此经过考虑,最后决定使用 Node + React 的开发模式,并且使用了 ...

  8. 使用Ant Design的select组件时placeholder不生效/不起作用的解决办法

    先来说说使用Ant Design和Element-ui的感觉吧. 公司的项目开发中用的是vue+element-ui,使用了一通下来后,觉得element-ui虽然也有一些问题或坑,但这些小问题或坑凭 ...

  9. 基于Ant Design UI框架的React项目

    概述 这款基于React开发的UI框架,界面非常简洁美观,在这篇文章中我主要为大家介绍一下如何用Ant开始搭建React项目 详细 代码下载:http://www.demodashi.com/demo ...

随机推荐

  1. SpringBoot自动化配置之二:自动配置(AutoConfigure)原理、EnableAutoConfiguration、condition

    自动配置绝对算得上是Spring Boot的最大亮点,完美的展示了CoC约定优于配置: Spring Boot能自动配置Spring各种子项目(Spring MVC, Spring Security, ...

  2. Vue 进阶系列(一)之响应式原理及实现

    Vue 进阶系列(一)之响应式原理及实现:https://juejin.im/post/5bce6a26e51d4579e9711f1d Vue 进阶系列(二)之插件原理及实现:https://jue ...

  3. Codeforces1256E_Yet Another Division Into Teams

    题意 n个人,每人有一个能力值a[i],要求分成多个队伍,每个队伍至少3个人,使得所有队伍的max(a[i])-min(a[i])之和最小. 分析 不会巧妙的dp,想了一天只想到了暴力的dp. 先排序 ...

  4. 掌握 analyze API,一举搞定 Elasticsearch 分词难题

    初次接触 Elasticsearch 的同学经常会遇到分词相关的难题,比如如下这些场景: 为什么明明有包含搜索关键词的文档,但结果里面就没有相关文档呢? 我存进去的文档到底被分成哪些词(term)了? ...

  5. 使用T4模板为EF框架添加数据库实体注释(转)

    1. 下载文件GetSummery.ttinclude2. 把我们下载下来的文件解压,将解压出来的文件放入解决方案中3. 修改下app.config,添加一个连接字符串: <add name=& ...

  6. 剑指offer 数字翻译成字符串

    0 -> 'a', 1->'b', ..., 11 -> 'l', ..., 25->'z'. 计算一个数有多少种不同的翻译方法. 分析:记f[i]表示从第i位起的不同翻译数目 ...

  7. 和IE6-IE8说拜拜 一段IE兼容HTML代码 针对IE版本写css

    通过这段html可以让你对特定的ie版本添加内容,只在特定版本ie展现,可以是javascript.css.html. <!--[if IE]> 这样使用IE浏览器(全部版本)的人都看得到 ...

  8. 隐藏ie input的X和眼睛图标

    IE10+ /** 文本输入框的 X **/input::-ms-clear{display: none;}/** 密码输入框的 X **/input::-ms-reveal{display: non ...

  9. iOS App沙盒目录结构

    转自:http://blog.csdn.net/wzzvictory/article/details/18269713 出于安全考虑,iOS系统的沙盒机制规定每个应用都只能访问当前沙盒目录下面的文件( ...

  10. 20180115-Xcode创建多个工程协同开发

    今天研究了一下在Xcode中创建多个工程,达到模块化的目的的同时,实现多个相似项目的协同开发,最主要的是可以实现多工程连编.项目的效果如下: 接下来创建一个这样的项目,以及他们之间的通信 1.建一个文 ...