Je n'ai du mal à combiner deux variables asynchrones dans un tableau:
mon code: strong> p> comme une réponse que je reçois 2 promesses remplies , mais je veux recevoir les résultats.
Comment puis-je résoudre ce problème? P>
3 Réponses :
Vous pouvez faire Promise.Alt met une gamme de promesses dans une nouvelle promesse, de même que de dire. P> Il est généralement utilisé après avoir démarré plusieurs tâches asynchrones pour fonctionner simultanément et avoir créé des promesses pour leurs résultats, de sorte que l'on puisse attendre que toutes les tâches soient terminées. P>
blockQuote> p>
Vous devez juste attendre votre réponse JSON.
async function fetchMenus ({actions, state}) { return actions.theme.fetchToken().then(async () => { const items = await fetch("url", { method: "GET", headers: { Authorization: `Bearer ${state.theme.token}`, }, }); const menu = await fetch("url", { method: "GET", headers: { Authorization: `Bearer ${state.theme.token}`, }, }); const itemsJson = await items.json(); const menuJson = await menu.json(); return [menuJson, itemsJson]; }); };
Je recommanderais de faire le const itemsjson = attendre les éléments.json (); code> avant de commencer à récupérer la deuxième réponse, cependant.
Curieux, quel est le raisonnement derrière cette recommandation?
C'est juste étrange d'avoir à deux demandes entrelacées comme ça. Je recommanderais même d'utiliser une fonction d'assistance pouvant être appelée deux fois pour supprimer la duplication de code.
Ok, oui je suis d'accord. Je me demandais s'il y avait des connaissances secrètes de bas niveau que vous avez eu de la façon dont les œuvres d'E / S fetch qui ont fait cette sous-optimale. : p
Il y a des erreurs par exemple Utilisation de Parce que vous retournez un tableau, vous pouvez directement écrire .json () code> est ASYNC aussi.
Promise.All () code> est un peu plus rapide parce que vos appels d'API ne semblent pas à compter sur EATCH AUTRE. P>
Retour en attente.All (menu.json (), items.json ()) code> parce que promettons tout Renvoie un tableau P>
async function fetchMenus({ actions, state }) {
let token = await actions.theme.fetchToken();
let [items, menu] = await Promise.all(
fetch("url", {
method: "GET",
headers: {
Authorization: `Bearer ${state.theme.token}`
}
}),
fetch("url", {
method: "GET",
headers: {
Authorization: `Bearer ${state.theme.token}`
}
})
);
return await Promise.all(menu.json(), items.json());
}
La syntaxe est incorrecte pourquoi vous utilisez
.Chen code> avec attendre dans
ligne n ° 2 code>
oui en fait, l'attendre était faux, mais malheureusement, cela ne résout pas le problème
Vous savez déjà utiliser
attendre code>. Pourquoi ne pas l'utiliser sur les promesses pour le corps JSON aussi?