объединить несколько переменных ожидания в один массив - PullRequest
0 голосов
/ 28 мая 2020

У меня проблемы с объединением двух асинхронных c переменных в один массив:

Мой код:

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}`,
          },
        });

        return [menu.json(), items.json()];
      });
    };

В качестве ответа я получаю 2 выполненных обещания, но я хочу получить результаты. Как я могу решить эту проблему?

enter image description here

Ответы [ 3 ]

2 голосов
/ 28 мая 2020

Вам просто нужно дождаться вашего ответа 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];
      });
    };

Изменить: я согласен с другими авторами об использовании Promise.all.

2 голосов
/ 28 мая 2020

Есть ошибки, например, .json() тоже asyn c.

Также использование Promise.all() немного быстрее, потому что ваши вызовы API, похоже, не зависят от eatch other.

Поскольку вы возвращаете массив, вы можете напрямую писать return await Promise.all(menu.json(), items.json()), потому что Promise all возвращает массив

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());
}
1 голос
/ 28 мая 2020

Вы можете сделать

Promise.all(fetchMenus(parameters).result).then((results) => {
 ... work with results
});

Promise.all помещает массив обещаний в новое обещание, так сказать.

Обычно это используется после запуска нескольких асинхронных задач для одновременного выполнения и создания обещаний для их результатов, чтобы можно было дождаться завершения всех задач.

...