He leído varias preguntas similares, pero todavía tengo problemas para poder cancelar mis solicitudes dada la estructura de mi código.

Al hacer clic en uno de los siguientes elementos, me gustaría poder cancelar todas las demás solicitudes, excepto la nueva, sin embargo, parece cancelar todas las solicitudes y luego evita que Axios realice nuevas. Soy nuevo en la cancelación de tokens, así que realmente no sé qué estoy haciendo mal aquí:

 import {cancelTokenSource} from 'API'; let isActiveRequest; document.body.addEventListener('click', async(e) => { const userElement = e.target.closest('.user-element'); const appElement = e.target.closest('.app-element'); if(isActiveRequest) { cancelTokenSource.cancel(); isActiveRequest = false; } if(userElement) { isActiveRequest = true; try{ const users = await Admin.getUsers(); isActiveRequest = false; // display users } catch(err) { isActiveRequest = false; } } if(appElement) { isActiveRequest = true; try{ const applications = await Admin.getApplications(); isActiveRequest = false; // display applications } catch(err) { isActiveRequest = false; } } });

API.js

 export const cancelTokenSource = axios.CancelToken.source(); export default axios.create({ baseURL: 'http://localhost:8080', cancelToken: cancelTokenSource.token });

Admin.js

 export default class Admin { getUsers({index, limit, orderField, orderDirection}) { return API.get('/admin/applicants', { params: { index, limit, orderField, orderDirection } }); } getApplications({index, limit, orderField, orderDirection}) { return JRS.get('/admin/applications', { params: { index, limit, orderField, orderDirection} }); ... }

Gracias

*** Actualizar

Pensé que tal vez necesitaba un nuevo token de cancelación por solicitud (ya que tal vez sea el token anterior el que bloquea cualquier solicitud nueva), así que intenté esto:

API.js

 export let cancelTokenSource; export default axios.create({ baseURL: 'http://localhost:8080', cancelToken: new axios.CancelToken(c => cancelTokenSource = c), });

principal.js

 if(isActiveRequest) { cancelTokenSource(); isActiveRequest = false; }

Pero sin suerte. Supongo que tal vez porque la instancia de axios es la misma para cada solicitud.

Voy a intentar agregar el token de cancelación a las funciones de Admin.js a continuación.