Question

我有一个主要的按钮，可以在单击按钮时执行。在此重击中，我想呼叫另一个重击，并等待其完成后再继续前进。第二个重击执行带有嵌套承诺的承诺。但是，我无法弄清楚如何等待第二个thunk完成其异步操作。

我尝试在thunk上使用dispatch(secondThunk()).then(...)关键字来使通话同步。我不能使用async关键字，因为我需要使用它才能在IE 11中正常工作。

我也尝试过使第二个重击项返回承诺，然后执行类似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(); }); }); }; }的操作，但是它表示我的重击项实际上没有返回承诺。

这是我的一些代码：

@OnCreateInitialState
static void createInitialState(
        ComponentContext c,
        StateValue<Boolean> state) {
    state.set(true);
}

当我运行代码时，mainThunk在执行之前不会等待secondThunk完成。您能帮我弄清楚如何进行这项工作吗？

Answer 1

您快到了。在mainThunk函数中，您需要等待promise解决或拒绝。我用Javascript而不是Typescript编写了演示。但是原理是相同的。 Code-sandbox here

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();

当在打字稿中被另一个thunk调用时，如何等待执行promise的redux thunk

1 个答案: