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