0
257
VistasReact.JS: API llamada con valor obsoleto
Tengo una función que realiza una llamada a la API para obtener la identificación de un recurso en particular. Esta identificación luego se pasa a una segunda llamada API como una solicitud de eliminación. El problema es que la primera API devuelve correctamente el valor, pero la segunda llamada todavía se ejecuta con un valor obsoleto (valor inicialmente asignado).
¿Supongo que esto es un problema de procesamiento paralelo tal vez? ¿Alguien puede proporcionar alguna orientación? Se adjunta mi código y salida. "4" es la identificación correcta devuelta por la primera API, pero la segunda llamada aún se realiza con "-1".
export function deleteBook(title: string): Promise<Book> { let bookId = -1; findBook(title).then((response) => { bookId = Number(response[0].id); console.log(bookId); }); let API = apiURL + `/api/books/${bookId}`; return axiosInstance .delete(API) .then((responseJson) => { return Promise.resolve(responseJson.data); }) .catch((error) => { return Promise.reject(error); }); } 
1 Respuestas
Responde la pregunta0
Actualmente está iniciando findBook, pero no está esperando a que finalice. Inmediatamente después de iniciar findBook, realiza la eliminación con bookId = -1. Algún tiempo después, findBook terminará, pero es demasiado tarde para ayudar a eliminarlo. Cualquier código que deba esperar en findBook, debe estar en la devolución de llamada .then (ya sea la inmediata o una más abajo en la cadena de promesa).
export function deleteBook(title: string): Promise<Book> { return findBook(title) .then(response => { const bookId = Number(response[0].id); const API = apiURL + `/api/books/${bookId}`; return axiosInstance.delete(API); }) .then(responseJson => { return responseJson.data; // No need to wrap it in Promise.resolve, you're already in a .then callback }); // No need to catch and then reject; that's the same as not catching it at all }Si prefiere async/await, el mismo código sería:
export async function deleteBook(title: string): Promise<Book> { const response = await findBook(title); const bookId = Number(response[0].id); const API = apiURL + `/api/books/${bookId}`; const responseJson = await axiosInstance.delete(API); return responseJson.data; }