reduxForm(config:Object)
一个装饰器,用于你的表单组件联接到Redux.可以通过一些参数来配置你的表单
Config Properties
IMPORTANT:所有的配置选项应该在“design time”(设计阶段)传递给reduxForm() 或者在运行阶段通过props传递给你的组件
Required(必需的)
form : String
这是你组件的name和key,它将加载在redux-form reducer下面
Optional(可选的)
enableReinitialize : boolean [optional]
当值为true时,表单的值会一直是initialValues的值。默认是false.
initialValues : Object<String, String> [optional]
values将在componentWillMount()初始化你的表单。这些值将与你的表单{field1:"value1",field2:"value1"}对应。
validate : (values:Object, props:Object) => errors:Object [optional]
一个同步验证函数,传入整个表单的values与props.如果你的验证需要返回{},如果验证失败,你需要返回验证的错误信息{field:<string,field2:<string>}
Props
以下所有的属性都是存在于redux-form装饰过的表单组件。其他部分props可以通过包裹组件传递
anyTouched : boolean
如果你触碰了任何fields anyTouched的值为true,否则为false
form : String
通过装饰器给表单的名字或通过属性给组件的名字(多个表单时候使用)
handleSubmit(eventOrSubmit) : Function
function,你可以这样使用<form onSubmit={handleSubmit}>
or to <button onClick={handleSubmit}>
.它可以验证数据,同步异步都行,如果表单有效,它将执行 this.props.onSubmit(data)
data为表单的数据。
另外,你可以将你定义的onSubmit函数传递给handleSubmit它将代替属性中的onSubmit.例如<form onSubmit={handleSubmit(this.save.bind(this))}>
如果你的onSubmit函数返回一个promise,submitting
属性将被设置为trun直到promise变为resolve或reject.如果reject的是一个object像 new SubmissionError({field:"err"})
那么submission errors将被添加到每一个field的error属性中就像异步验证错误一样。如果这个error没指定任何field,但是适用于整个表单。 you may pass that as if it were the error for a field called _error, and it will be given as the error prop.(这句有不是很明白什么意思)
handleSubmit的两种用法
1.传递一个函数来调用
<button onClick={handleSubmit(data => {
// do something with data. validation will have been called at this point,
// so you know the data is valid
})}>Submit</button>
2.给onSubmit属性传递一个函数
<MyDecoratedForm onSubmit={data => {
// do something with data. validation will have been called at this point,
// so you know the data is valid
}}/>
initialize(data:Object) : Function
初始化函数,用于初始化表单的值。dirty和pristine会由当前值与初始值对比来确定,这是一个绑定行为创造者,所以没有返回值
initialValues : Object
通过reduxForm的属性来初始值来初始化initalize表单数据
invalid : boolean
如果有验证的错误信息则为true, valid属性与之相反
pristine: boolean
如果表单数据与初始值相同则为true, dirty属性与之相反
reset() : Functionå
用初始值重设表单的数据,重置pristine。这是一个绑定行为创造者,所以没有返回值
submitting : boolean
不管你的表单是否提交,这是属性只在你的handleSubmit函数返回值是个promise时有效,它的值在此过程中为true直到你的promise返回一个resolve或reject
网友评论