Redux thunk: вернуть обещание от отправленного действия

Question

Можно ли вернуть обещание/сигнал от создателя действия, разрешенного, когда Redux thunk успешно отправил определенное действие?

Рассмотрит действие создателя:

function doPost(data) { 
    return (dispatch) => { 
     dispatch({type: POST_LOADING}); 
     Source.doPost() // async http operation 
      .then(response => { 
       dispatch({type: POST_SUCCESS, payload: response}) 
      }) 
      .catch(errorMessage => { 
       dispatch({type: POST_ERROR, payload: errorMessage}) 
      }); 
    } 
} 

Я хочу вызвать некоторую функцию асинхронно в компоненте после вызова doPost действия создателя, когда Redux имеет либо отправлено POST_SUCCESS или POST_ERROR действие. Одним из решений было бы передать обратный вызов самому создателю действия, но это сделало бы код грязным и трудным для понимания и поддержки. Я мог бы также опросить состояние Redux во время цикла, но это было бы неэффективно.

В идеале решение будет представлять собой обещание, которое должно быть разрешено/отклонено при отправке определенных действий (в данном случае POST_SUCCESS или POST_ERROR).

handlerFunction { 
    doPost(data) 
    closeWindow() 
} 

Приведенный выше пример должен быть переработан, так CloseWindow() вызывается только тогда, когда doPost() является успешным.

Answer 1

Конечно, вы можете вернуть обещание от асинхронных действий:

function doPost(data) { 
    return (dispatch) => { 
     dispatch({type: POST_LOADING}); 
     // Returning promise. 
     return Source.doPost() // async http operation 
      .then(response => { 
       dispatch({type: POST_SUCCESS, payload: response}) 
       // Returning response, to be able to handle it after dispatching async action. 
       return response; 
      }) 
      .catch(errorMessage => { 
       dispatch({type: POST_ERROR, payload: errorMessage}) 
       // Throwing an error, to be able handle errors later, in component. 
       throw new Error(errorMessage) 
      }); 
    } 
} 

Теперь dispatch функции возвращает обещание:

handlerFunction { 
    dispatch(doPost(data)) 
     // Now, we have access to `response` object, which we returned from promise in `doPost` action. 
     .then(response => { 
      // This function will be called when async action was succeeded. 
      closeWindow(); 
     }) 
     .catch(() => { 
      // This function will be called when async action was failed. 
     }); 
}