Th problem appears, when I try to create a FieldArray Formik to worm with an array inside an nested object. The code I use to get values is like ‘arrayHelpers.form.values[arrayHelpers.name].conditions’
It works quite well, when it comes to displaying the values and correcting them, but when it comes to creating row (PUSH) i get an error ‘can’t access property “push”, arrayHelpers[arrayHelpers.name] is undefined’
the whole component is in the sandbox https://codesandbox.io/s/heuristic-williams-6jocp1?file=/src/Formik.tsx:1039-1040
FieldArray looks like this:
export const FieldArrayConditions = (arrayHelpers: any) => {
const conditions = arrayHelpers.form.values[arrayHelpers.name].conditions
return(
<>
{conditions.map((_: void, index: number) => {
return (
<div key={index} className='form__row-condition'>
<input type='hidden' name={`${arrayHelpers.name}.conditions[${index}].id`}/>
<input type='hidden' name={`${arrayHelpers.name}.conditions[${index}].margin_id`}/>
<Field
type='number'
name={`${arrayHelpers.name}.conditions[${index}].price_from`}
component={InputNotLabeled}
/>
<Field
name={`${arrayHelpers.name}.conditions[${index}].price_measure.id`}
component={SelectorCurrencies}
/>
<span>до</span>
<Field
type='number'
name={`${arrayHelpers.name}.conditions[${index}].price_before`}
component={InputNotLabeled}
/>
<Field
name={`${arrayHelpers.name}.conditions[${index}].price_measure.id`}
component={SelectorCurrencies}
/>
<span>=</span>
<Field
type='number'
placeholder='Сумма'
name={`${arrayHelpers.name}.conditions[${index}].margin`}
component={InputNotLabeled}
/>
<Field
name={`${arrayHelpers.name}.conditions[${index}].price_measure_id`}
component={SelectorCurrencies}
value={`${arrayHelpers.name}.conditions[${index}].price_measure.id`}
/>
</div>
)
})}
<div className="form__fieldset">
<BtnExport text={'Добавить условие'}
changeAction={() => arrayHelpers.push(initialConditions)}/>
</div>
</>
)}