问如何等待从typescript中的另一个thunk调用时执行承诺的redux thunk
EN

Stack Overflow用户

提问于 2019-05-03 21:04:09

回答 1查看 364关注 0票数 0

我有一个主要的thunk，当点击一个按钮时会被执行。在这个thunk中，我想调用另一个thunk，等待它完成后再继续。第二个thunk使用嵌套的promise来执行promise。然而，我还不知道如何等待第二个thunk完成它的异步操作。

我尝试在我的thunk中使用return关键字来使调用同步。我不能使用async关键字，因为我需要它在IE 11中工作。

我也尝试过让我的第二个thunk返回一个promise，然后做一些像这样的dispatch(secondThunk()).then(...)，但是它显示我的thunk实际上并没有返回promise。

下面是我的一些代码：

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完成。你能帮我弄清楚怎么做吗？

javascript

typescript

promise

redux-thunk

人脸识别特惠活动

精准实时的人脸检测、分析、识别等服务，在线、离线满足多样需求，可应用于智慧零售、智慧社区、在线娱乐等多种应用场景

回答 1

Stack Overflow用户

发布于 2019-05-04 09:57:40

你就快到了。在您的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();