react-final-form how to load initialValues from ajax call

Question

Looking at the example in https://codesandbox.io/s/km2n35kq3v

The initial values are hard-coded.

<Wizard
      initialValues={{ employed: true, stooge: 'larry' }}

However, i want to make an ajax call in ComponentDidMount, fetch the initial values, then (re) set the initialValues when the call completes.

<Wizard
      initialValues={this.state.myInitValues}

Nothing happens, when the form re-renders, the initialValues do not change - What am i missing ?

Answer 1

I figured this out.. that example only works for hard-coded values, I should not have assume otherwise.

It turns out initialValues are being passed down to the Wizard component and set as state within the Wizard component in the constructor.

When the ajax call returns, the constructor does not get executed again.