redux-form
水痕01
暂停更新博客
展开
-
Redux-form嵌套到实际项目开发案例八
初始化数据|demo|----webpack.config.js|----package.json|----index.html //引入了bootstrap.css|----node_modules //存放工具包|----src |--------index.js //入口文件|--------action|------------index.js|--------com原创 2017-04-11 16:09:09 · 2325 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例九
本案例是直接获取数据|demo|----webpack.config.js|----package.json|----index.html //引入了bootstrap.css|----node_modules //存放工具包|----src |--------index.js //入口文件|--------actions|--------components|-------原创 2017-04-12 15:44:06 · 998 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例七
本案例是异步请求验证,输入框失去焦点就验证官方案例一、asyncValidate.js代码const sleep = ms => new Promise(resolve => setTimeout(resolve, ms))const asyncValidate = (values/*, dispatch */) => { return sleep(1000) // simulate se原创 2017-04-07 18:00:35 · 1054 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例六
提交时候验证官方案例一、submit.js文件代码import {SubmissionError} from 'redux-form'const sleep = ms => new Promise(resolve => setTimeout(resolve, ms))function submit(values) { return sleep(1000) // simulate serve原创 2017-04-07 17:45:51 · 1076 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例五
本案例是同步校验表单的另外一种写法,操作方法一样的跟案例三是一样的一、新建一个src/component/FieldLevelValidationForm.js'use strict';import React,{Component} from 'react'import {Field, reduxForm} from 'redux-form'//定义一个必填的校验方法const requ原创 2017-04-07 16:57:22 · 899 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例四
本案例是同步校验表单一、本案例与案例三是一样的操作方式'use strict';import React from 'react'import { Field, reduxForm } from 'redux-form'//定义校验的方法const validate = values => { const errors = {} if (!values.username)原创 2017-04-07 16:35:20 · 1013 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例三
一、运行本项目案例直接把代码拷贝到案例一中的components文件夹下二、新建一个文件src/component/SimpleForm2.js文件'use strict';import React,{Component} from 'react'import {Field, reduxForm} from 'redux-form'class SimpleForm2 extends Compon原创 2017-04-07 16:25:05 · 1421 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例二
ReduxForm和表单关联分为两个层面表单层面:ReduxForm提供的ReduxForm装饰器为表单组件提供了handleSubmit, pristine, reset, submitting等props,分别用于提交表单、判断表单数据是否改动、重置表单、显示正在提交这些功能字段层面:ReduxForm派遣了Field等组建与表单字段关联,Field不仅提供了一个component属性可以接原创 2017-04-07 15:10:19 · 1364 阅读 · 0 评论 -
Redux-form系列教程
一、Redux-form部署到redux项目中二、Redux-form与form的关系三、redux-form直接使用html标签四、redux-form同步校验表单五、redux-form同步校验表单六、redux-form提交验证表单七、redux-form异步校验(失去焦点就校验)八、redux-form初始化数据及同步校验九、redux-form直接获取数据原创 2017-04-12 15:30:06 · 1556 阅读 · 0 评论 -
Redux-form嵌套到实际项目开发案例一
最近本人一直在研究redux在项目中开发,在实际项目中开发中离不开的是form表单,在react开发中有redux-form提供了这个组件进行form表单的开发一、本案例是在之前案例的基础上移入了redux-form如果不有不清楚之前案例的请查看React-Redux链接React与Redux开发项目二、目录结构|react-redux-demo|----webpack.config.js|-原创 2017-04-06 13:17:50 · 1547 阅读 · 1 评论