Tengo un campo MaterialUI Autocompletar con algunas llamadas desde la API. Cerca de ese campo tengo un botón que llama a la API para actualizar las opciones (para cargar nuevas, si se crearon algunas). Pero, de alguna manera, todos los demás campos se reducen a los valores iniciales. Lo sé porque cuando hago esto mientras edito una instancia existente y no creo una nueva, los campos permanecen como vinieron del servidor. Además, probé una llamada a la API sin actualizar el estado de las opciones. Incluso después de una simple espera de los valores del formulario de llamada axios, se borran.
Aquí está la entrada de autocompletar:
<FastField name="club" options={clubs} optionsLoading={clubsLoading} shouldUpdate={(next, prev) => shouldFastFieldRerender(next, prev, getIn) } > {() => ( <FormField.AutoComplete label="Клуб" name="club" value={values.club} setFieldValue={setFieldValue} setTouched={setFieldTouched} touched={touched.club} errors={errors.club} options={clubs} disabled={clubsLoading} selectionDisabled={clubsLoading} /> )} </FastField>
Y aquí está el botón cerca de él:
<IconButton type="button" className={classNames( classes.btn, classes.reloadButton )} onClick={fetchClubs} > <ReplayIcon /> </IconButton>
La función de búsqueda:
const fetchClubs = React.useCallback(async () => { const clubs = await getClubs(); setClubs(clubs); }, [getClubs]);
Entonces, incluso si comento la función setClubs y solo await getClubs()
, el formulario se restablecerá de todos modos