Unable to set initial state for FieldArray fields in redux-form
I've been battling with FieldArray initialization in redux-form and nothing seems to work. I've tried all the obvious approaches but keep hitting walls.
- Basic initialValues:
export default reduxForm({
form: 'FrontPageForm',
enableReinitialize: true,
initialValues: {
images: [{a: '123'}, {b: '123'}], // Nope, doesn't work
}
})(FrontPageForm)
- Programmatic initialization with useEffect:
useEffect(() => {
const initialValues = isJSON(data) ? JSON.parse(data) : {};
initialize(initialValues) // Still nothing
}, [data]);
- Manual fields manipulation:
<FieldArray
name={'images'}
component={({fields}) => {
if(!!fields.length) {
fields.push([1,2,3]) // Desperation move - also nope
}
return (
<>
{fields.map((el, i) => (
<RenderMultipleDropzone
name={el}
multiple={false}
handleImageChange={handleImageChange}
/>
))}
</>
)
}}
/>
I've read all the docs, SO posts, and GitHub issues I can find. Either I'm missing something fundamental or there's a bug here.
redux-form: 8.3.0 react: 16.11.0
Please help before I lose my last remaining hair.
Source: redux-form/redux-form