Как ожидать избыточного thunk, который выполняет обещание при вызове из другого thunk в машинописи - PullRequest
0 голосов
/ 04 мая 2019

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

Я попытался использовать ключевое слово return в моем thunk, чтобы сделать вызов синхронным. Я не могу использовать асинхронные ключевые слова, так как мне нужно, чтобы это работало в IE 11.

Я также пытался заставить моего второго бандита вернуть обещание, а затем сделать что-то подобное dispatch(secondThunk()).then(...), но затем говорится, что мой бандит на самом деле не возвращает обещание.

Вот мой код:

export function mainThunk(): ThunkAction<void, void, void, AnyAction> {
    return (dispatch: Dispatch<any>) => {
    ...do some stuff
    dispatch(secondThunk());
    ...do other stuff
    };
}

export function secondThunk(): ThunkAction<void, void, void, AnyAction> {
    return (dispatch: Dispatch<any>) => {
      return new Promise((resolve: any, reject: any) => {
        someAsyncFunction()
        .then((response) => {
           return Promise.all(someArray.map(someId => {
             return someOtherAsyncFunction(someId):
         }));
        })
        .then((responses) => {
           response.foreach(response => {
             dispatch(someReduxAction(response.someField));
           });
        })
        .then(() => {
          resolve();
        });
    });
    };
}

Когда я запускаю свой код, mainThunk не ожидает завершения secondThunk перед выполнением. Можете ли вы помочь мне разобраться, как заставить это работать?

1 Ответ

0 голосов
/ 04 мая 2019

Ты почти у цели.В вашей функции mainThunk вам нужно дождаться разрешения или отклонения обещания.Я написал свою демонстрацию в Javascript, а не в Typescript.Однако принципы одинаковы. Код-песочница здесь

import axios from "axios";

function mainThunk() {
  secondThunk()
    .then(data => {
      console.log("success");
      console.log(data);
    })
    .catch(e => {
      console.log("something went wrong");
      console.log(e);
    });
}

function secondThunk() {
  return new Promise((resolve, reject) => {
    axios
      .get("https://swapi.co/api/people/")
      .then(people => {
        someOtherAsyncFunction().then(planets => {
          const response = {
            planets: planets,
            people: people
          };
          resolve(response);
        });
      })
      .catch(e => {
        reject(e);
      });
  });
}

function someOtherAsyncFunction() {
  return axios.get("https://swapi.co/api/planets/").then(response => {
    return response;
  });
}

mainThunk();

...