The initial values ​​of the reduction form created in the form of a map

I have a reduction form and am trying to initialize the form using initialValues . Given the following code, the form is not populated with either a name or age:

 const EmployeesForm = reduxForm({ form: 'addEmployee', enableReinitialize: true })(EmployeesFormComponent) export default connect((state, ownProps) => { const initialValues = { name: 'Jason', age: 24 } return { initialValues: initialValues } })(EmployeesForm) 

But in the web dev console, when checking next state on redux, I see that form.values and form.initial are both Map objects that contain these initialValue values.

enter image description here

How can I transform an object so that it "fits" into the form. BTW I use: import { Field, reduxForm } from 'redux-form/immutable' and it takes the form 6.8.0.

+6
react-native redux-form
source share
2 answers

This may be a problem with your field definition field definition.

 <Field name="name" component={TextInput} /> <Field name="age" component={TextInput} /> 

Make sure this is the correct definition for your form. if you can also add the Markup component to make it easy to debug.

In addition, another tricky part in the native reaction with the redux form is the onChangeText callback, not the onChange callback, so in order to take this into account, you will have to create a wrapper around the TextInput component responsible for the reaction

 const TextInputNative = ({ input: { onChange, ...inputProps }}) => { return <TextInput onChangeText={onChange} {...inputProps} /> } const EmployeesFormComponent = () => ( <Field name="name" component={TextInputNative} /> <Field name="age" component={TextInputNative} /> ); 

This can also prevent updating the form with the initial values.

+1
source share

As for immutableJS, you can get initialValue as an object using yourMap.toJS ()

But you do not need to manually convert the map to an object, as it will take care of it redux-form/immutable and in accordance with the redux-form docs

When you use an immutable version of the reduction form, the values ​​that the reduction form gives you for validation and presentation will be in the Immutable.Map file

If you do not need an immutable card and all this jazz, I would recommend going for a non-immutable version of reduxform.

0
source share

All Articles