When using, redux-form
you do not need to set the value directly in the field. You can use the method initialize
to fill out the form. Or initialValues
as a property of the object passed in redux
to display the state in the details. Another way is to set the values individually using the change
from function redux-form
. To make it work, you need to wrap your component connect
from react-redux
. He embeds the method dispatch
in your details.
import React, { Component } from 'react';
import { reduxForm, Field } from 'redux-form';
import { connect } from 'react-redux';
class Form extends Component {
componentDidMount() {
this.props.initialize({ accountno: 'some value here' });
// set the value individually
this.props.dispatch(change('myFormName', 'anotherField', 'value'));
}
render() {
return (
<form onSubmit={...}>
...
<Field name="accountno" component={InputText} placeholder="Number" />
<Field name="anotherField" component={InputText} />
</form>
)
}
}
Form = reduxForm({
form: 'myFormName'
})(Form);
export default connect(state => ({
// alternatively, you can set initial values here...
initialValues: {
accountno: 'some value here'
}
}))(Form);