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

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

Вот часть моего кода:

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

export function secondThunk(): ThunkAction<Promise<any>, 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();
        });
    });
    };
}


Код, кажется, работает во время выполнения, но у меня есть ошибка компиляции, говорящая: Property "then" does not exist on type "ThunkAction<Promise<any>, void, void, AnyAction>"

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

1 Ответ

1 голос
/ 06 мая 2019

разобрался с решением.Как только вы используете промежуточное программное обеспечение Thunk, ваша отправка становится ThunkDispatch вместо простого Dispatch.Но Typescript умный, вам на самом деле не нужно вводить функцию отправки.Таким образом, удаление типа при отправке устраняет проблему.Смотрите ниже:

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

export function secondThunk(): ThunkAction<Promise<any>, void, void, AnyAction> {
    return (dispatch) => {
      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();
        });
    });
    };
}
...