Rendering form with array of objects

I have the following problem:

I’m trying to render multiple input fields based on index such as:

{values.education.map((item, index) => getInputFields(index))}

where values contains an array of objects as:

education: [ 
{
what: '',
where: '',
description: '',
startDate: '',
endDate: ''
} 
]

and getInputFields(index) renders a set of input fields based on the education index.

The problem im running into is that if i use the default handleChange from formik, the values object i get is:

{
education[0].what: ''
education[0].where: '',
education[0].description: '',
education[0].startDate: '',
education[0].endDate: ''
}

So i decided to implement a custom onChange handler that uses the setFieldValue to manually set education. It works up to a point. Now my errors and touched objects are not working. Errors return the exact same object as before:

{
education[0].what: 'This field is required.'
education[0].where: 'This field is required.',
education[0].description: 'This field is required.',
education[0].startDate: '',
education[0].endDate: ''
}

Is there a special way to handle a form with an array of objects?

Will this feature be implemented anytime soon in formik?

[andymac4182]

Something similar to this would be great https://redux-form.com/7.0.4/docs/api/fieldarray.md/

[rcampos87]

my input names do use unique names education[{index}].what etc… it would be a not-so-elegant solution to convert a flat list into a nested structure… but if thats the only way…

if formik would use path instead of field name, itd be so helpful.