总结下使用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,是一个数组,值为需要管理的字段。