Así que tengo problemas para almacenar en caché mis opciones de autocompletar para el componente de autocompletar de mui. Esto es lo que tengo actualmente:

Mi función de recuperación que se llama en la entrada del cliente: (está limitada)

 const handleAutocompleteInput = (event, value) => { fetch(`http://localhost:80/players/autocomplete?term=${encodeURIComponent(value)}`) .then((response) => response.json()) .then((names) => { setAutoCompleteOptions(names); }); };

Mi estado para las opciones de autocompletar (que se encuentra en un componente principal, por lo que paso setAutoCompleteOptions a los elementos secundarios):

 const [autoCompleteOptions, setAutoCompleteOptions] = useState([])

Y mi componente de autocompletar:

 <Autocomplete fullWidth options={autoCompleteOptions} classes={classes} getOptionLabel={(autoCompleteOptions) => autoCompleteOptions.name} onInputChange={_.debounce( (event, value) => handleAutocompleteInput(event, value), 300 )} isOptionEqualToValue={(autoCompleteOptions, value) => autoCompleteOptions.id === value.id } //getOptionDisabled={(option) => /// option === timeSlots[0] || option === timeSlots[2] //} renderInput={(params) => <TextField {...params} placeholder="Име на играч" />} />

Los objetos que recibo del fetch.

 {id: some id, name: some name}

Estoy reemplazando las opciones de autocompletar por completo en cada respuesta que recibo de la función de búsqueda. ¿Cómo puedo almacenarlos en caché y tener solo una instancia de los objetos que recibo?