Así que tengo dos funciones que obtienen datos de la API. Uno de ellos actualiza la finalización del todo y el otro obtiene la lista de todos. Actualmente, la función UpdateAndFetch() se queda atrás y, a veces, devuelve la lista no actualizada.
¿Cómo puedo arreglar esto?
let base = import.meta.env.VITE_API_BASE // fetch the todos that belong to groupId export async function TESTFetchTodosFromGroup(groupId, todos, groupName) { let url = `${base}/todos/group/${groupId}` fetch(url).then(async (response) => { const json = await response.json() todos.value = json.data groupName.value = json.message if (!response.ok) { return Promise.reject(error) } }) } // export async function TESTupdateCompletion(todo) { // let url = `${base}/todos/completion/${todo.todoId}` var requestOptions = { method: 'PATCH', redirect: 'follow', } fetch(url, requestOptions) .then((response) => response.json()) .then((result) => console.log(result)) .catch((error) => console.log('error', error)) } async function UpdateAndFetch(todo, groupId) { const updateTodoCompletion = await TESTupdateCompletion(todo) const updateTodoList = await TESTFetchTodosFromGroup(groupId, todos, groupName) }Siempre tiene que devolver una función de búsqueda; de lo contrario, no pasará el valor a la siguiente llamada asíncrona.
Y para tener la capacidad de ejecutar la función una por una, puede hacerlo donde llama a sus funciones.
async function UpdateAndFetch(todo, groupId) { Promise.resolve(() => updateTodoCompletiong(todo)).then(response => fetchTodosFromGroup(groupId,todos,groupName)) }después de eso, puede detectar errores.
Puede leer la documentación aquí, es realmente muy útil lo que proporciona javascript. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/resolve
tambien si alguna duda dejen un comentario.
No importa, encontré cómo solucionar esto.
Envuelva las funciones de búsqueda para que sean un valor de retorno
// fetch the todos that belong to groupId export async function fetchTodosFromGroup(groupId, todos, groupName) { let url = `${base}/todos/group/${groupId}` // you need to wrap the fetch into return so that the awaits would work ! return fetch(url).then(async (response) => { const json = await response.json() todos.value = json.data groupName.value = json.message if (!response.ok) { return Promise.reject(error) } }) // Promise.resolve('done') } // export async function updateTodoCompletion(todo) { // let url = `${base}/todos/completion/${todo.todoId}` var requestOptions = { method: 'PATCH', redirect: 'follow', } // you need to wrap the fetch into return so that the awaits would work ! return ( fetch(url, requestOptions) .then((response) => response.json()) .then((result) => console.log(result)) // .then(() => TESTFetchTodosFromGroup()) .catch((error) => console.log('error', error)) ) }Refactorizar la función que ejecuta las funciones
// delete the todo and fetch the list async function UpdateAndFetch(todo, groupId) { await updateTodoCompletion(todo) await fetchTodosFromGroup(groupId, todos, groupName) }