总结下使用Redux-Form的步骤,基本的Form使用我分为一下5步:

  • 安装Redux-Form
npm install --save redux-form
  • 创建reducer
import {reducer as formReducer} from 'redux-form'

const reducers = combineReducers({
// ... your other reducers here ...
form: formReducer
}) export default reducers

也可以参考redux-form官方文档的写法。

  • 在组件中引入redux-form
import { reduxForm } from ' redux-form '
  • 定义redux-form需要管理的字段
render(
const {fields: {name1,name2, name3}, handleSubmit} = this.props
return(
<form>
   <input type='text' {...name1}/>
         <input type='text' {...name2}/>
          <input type='text' {...name3}/>
      </form> ) ) 
  • 调用reduxForm方法
Form = reduxForm({
form: 'formName',
fields: ['name1', 'name2', 'name3']
})(DataSetNewPolicyForm)

必须配置的是form,就是表单的名字。fields,是一个数组,值为需要管理的字段。

Redux-Form学习笔记的更多相关文章

  1. 【原】redux异步操作学习笔记

    摘要: 发觉在学习react的生态链中,react+react-router+webpack+es6+fetch等等这些都基本搞懂的差不多了,可以应用到实战当中,唯独这个redux还不能,学习redu ...

  2. [原创]java WEB学习笔记62:Struts2学习之路--表单标签:form,表单标签的属性,textfield, password, hidden,submit ,textarea ,checkbox ,list, listKey 和 listValue 属性,select ,optiongroup ,checkboxlist

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  3. Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法

    Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法 昨天在开发的时候遇到个小问题,就是如何将Grid的内容与Form一起发送到服务器端.默认情况下,表单(F ...

  4. React+Redux学习笔记:React+Redux简易开发步骤

    前言 React+Redux 分为两部分: UI组件:即React组件,也叫用户自定义UI组件,用于渲染DOM 容器组件:即Redux逻辑,处理数据和业务逻辑,支持所有Redux API,参考之前的文 ...

  5. 笔记:FastAdmin 之 jQuery 选择器 $("[name$='[]']", form) 学习

    笔记:FastAdmin 之 jQuery 选择器 $("[name$='[]']", form) 学习 $("[name$='[]']", form)这个是什 ...

  6. amazeui学习笔记--css(HTML元素3)--表单Form

    amazeui学习笔记--css(HTML元素3)--表单Form 一.总结 1.form样式使用:在容器上添加 .am-form class,容器里的子元素才会应用 Amaze UI 定义的样式. ...

  7. Django学习笔记(14)——AJAX与Form组件知识补充(局部钩子和全局钩子详解)

    我在之前做了一个关于AJAX和form组件的笔记,可以参考:Django学习笔记(8)——前后台数据交互实战(AJAX):Django学习笔记(6)——Form表单 我觉得自己在写Django笔记(8 ...

  8. AntDesign vue学习笔记(七)Form 读写与图片上传

    AntDesign Form使用布局相比传统Jquery有点繁琐 (一)先读写一个简单的input为例 <a-form :form="form" layout="v ...

  9. Django学习笔记(6)——Form表单

    知识储备:HTML表单form学习 表单,在前端页面中属于最常见的一个东西了.基本上网站信息的提交都用到了表单,所以下面来学习Django中优雅的表单系统:Form 表单的主要作用是在网页上提供一个图 ...

  10. redux-form的学习笔记

    redux是一种常用的与react框架搭配的一种数据流架构,而伴随着redux的出现,也出现了许多基于redux开源的第三方库,而redux-form就是其中之一的开源组件库,到今天我写下这篇笔记为止 ...

随机推荐

  1. Magento1.9批量修改产品 Attribute Set

    今天修改产品时遇到这样一个需求:重新设置产品的 Attribute Set,使用的是Magento1.9系统,Magento提供这样一个插件 Flagbit Change Attribute Set: ...

  2. 三、HTTP抓包测试

    package testHTTP; import java.io.BufferedReader;import java.io.IOException;import java.io.InputStrea ...

  3. 编码UTF-8

    ☯,首先,这并不是图片,这是一个unicode字符,Yin Yang,即阴阳符,码点为U+262F.如果你的浏览器无法显示,可以查看这个链接http://www.fileformat.info/inf ...

  4. Linux 安装node.js ---- 源码编译的方式

    一 : 普通用户: 安装前准备环境: 1.检查Linux 版本 命令: cat /etc/redhat-release 2.检查 gcc.gcc-c++ 是否安装过 命令: rpm -q gcc rp ...

  5. Mysql插入数据为何要加上" ` "(Esc下面那个按键符号)?

    资料上和以前学习的SQL语言,往数据库里面插入数据语句是这样的 INSERT INTO test_table (clo_1, col_2) VALUES("this is value of ...

  6. js面向对象,多种创建对象方法!

    1.对象字面量. var clock={ hour:12, minute:10, second:10, showTime:function(){ alert(this.hour+":&quo ...

  7. Centos | Linux 下安装启动 mysql 出现 8618 [ERROR] Aborting,查看日志:Plugin 'FEDERATED' is disabled.

    1.试试启动时指定配置文件 ./bin/mysqld_safe --defaults-file=mysql.cnf 或 ./bin/mysqld_safe --defaults-file=mysql. ...

  8. 搭建高可用mongodb集群(四)—— 分片

    按照上一节中<搭建高可用mongodb集群(三)—— 深入副本集>搭建后还有两个问题没有解决: 从节点每个上面的数据都是对数据库全量拷贝,从节点压力会不会过大? 数据压力大到机器支撑不了的 ...

  9. win7 部署WCF遇到的问题记录

    1. IIS7 handler Mappings默认没有*.svc 的处理,需要安装(页面错误提示好像会提示缺少相应的处理器,记不清楚了) 方法:使用 ServiceModelReg.exe 工具 路 ...

  10. 性能优化九之UI卡顿分析

    在前一篇博客中提到内存抖动和耗时复杂的计算会导致UI卡顿. 那为什么内存抖动会导致UI卡顿呢? 其实在 性能优化一之内存与垃圾回收器 这篇文章中已经有所提及. 这里来详细说明一下: 渲染功能是应用程序 ...