Set the value of an input based on something outside of the form?

I looked in the documentation, and didn’t find an answer to this, so I apologize if it’s covered and I missed.

Our app has some fields which are linked to each other. Imagine they look like this:

<input name="input-a" onChange={e => {props.handleChange(e); props.updateParentStuff(e)}} />
<input name="input-b" onChange={e => {props.handleChange(e); props.updateParentStuff(e)}} />

When one of the inputs is updated, the parent hits an API to get some kind of value back, and then the other input needs to be updated, or vis-a-versa. So the flow looks like this:

Update input-a => pass value to parent => call api => return value => update input b
OR
Update input-b => pass value to parent => call api => return value => update input a

The issue is I can’t find a way to force an input in the Formik form to have a certain value, outside of setting the initialValue parameter (we’re using the render prop). I’m hacking around this problem right now by taking a state variable in the parent, and merging it with the values which get submitted when the form is. I’d like to just have the values represent the actual data to be submitted, though.

Thanks!

[prichodko]

Probably you also want to use - https://github.com/jaredpalmer/formik#enablereinitialize-boolean, which is falseby default.

[ganpats]

setFieldValue is also useful, for e.g.: props.setFieldValue('birth_date', selectedDate);