Передача значения по умолчанию в Redux Form
- Чтобы передать значения по умолчанию в Redux Form мы в ProfileInfo, где рисуется наша формочка ProfileDataForm (не внутри самой формочки!), передаем в пропсах в нее наш объект profile из сервера, как initialValues:
{editMode ? <ProfileDataForm initialValues={profile} profile={profile} onSubmit={onSubmit} /> : <ProfileData goToEditMode={() => { setEditMode(true) }} profile={profile} isOwner={isOwner} />}
И так как структура profile совпадает со структурой, которая у нас в ProfileDataForm раскинута по неймам, совпадают, то теперь в инпуты сразу приходят данные из сервера в качестве значений по умолчанию.
Но если бы структура не совпадала, т.е. name поля формы не называлось бы profile, тогда initialValues должен бы был быть вот такого формата:
<CheckReduxForm onSubmit={onSubmit} initialValues={{name: numberCar}} />
где number – это name поля формы (input или textarea), для которого присваивается значение по умолчанию.
- Чтобы форма каждый раз повторно инициализировалась (это нужно, если значение по умолчанию берется из стейта через конект), необходимо в месте оборачивания компоненты с формой при помощи Redux Form, помимо названия формы, обязательно добавить еще свойство enableReinitialize со значением true:
const CheckReduxForm = reduxForm({ form: 'check', //название формы enableReinitialize: true //вызов повторной инициализации })(CheckForm);
Альтернативным вариантом первому пункту один из блогеров в своей статье предлагает законектить саму форму к стейту и предавать в пропсы initialValues без опрокидывания компонент более высокого уровня:
const mapStateToProps = (state) => ({ initialValues: state.initialName, // retrieve name from redux store })
Хотя там он говорит о необходимости переделки компоненты в классовую, но может и с функциональной сработает. Возможно, придется деструктуризировать initialValues в пропсах.