我应该在调度时捕获 Redux promise 错误还是只在 reducer 中处理它？

Question

所以基本上我正在使用 thunk 和 redux-promise-middleware 调度一个动作，这使得 API 调用返回一个承诺。然后我将返回的承诺作为“有效载荷”参数发送给另一个动作创建者，该参数与 redux-promise-middleware 一起使用并处理不同的动作 MY_ACTION_TYPE_PENDING 或 MY_ACTION_TYPE_REJECTED 或 MY_ACTION_TYPE_FULFILLED。我的问题是我是否通过 _REJECTED 操作处理 reducer 中的错误，而不是在我的 dispatch(actionCreator(payload)？ _REJECTED ACTION 错误。

下面是我的一些操作：

export const RECEIVE_POSTS = 'RECEIVE_POSTS';
export const receivePosts = (data) => ({
    type: RECEIVE_POSTS,
    payload: data
})

// thunk middleware for fetching blog
                    export const fetchPosts = () => { 
                        return (dispatch) => {
                            const payload = contentfulClient.getEntries().then(
                                data => data.items,
                                error => console.log('An error occurred in fetchPost thunk middleware', error)
                                ) 
                            return dispatch(receivePosts(payload))
                            .catch((error) => {
                                console.log('caught error in fetchPost', error)
                            })
                        }
                    }

然后这是我的一些博客 reducers 文件，它处理 promise 中间件发出的操作

const status = (state = Status.IDLE, action) => {
    switch (action.type) {
        case `${RECEIVE_POSTS}_PENDING` : 
            return Status.PENDING;      
        case `${RECEIVE_POSTS}_FULFILLED`:
            return Status.FULFILLED;
        case `${RECEIVE_POSTS}_REJECTED`:
            return Status.REJECTED;
        default:
            return state
    }
}

const error = (state = null, action) => {
    switch (action.type) {
    case `${RECEIVE_POSTS}_REJECTED`: 
        return action.payload.message
    default:
        return state;
    }
}

Answer 1

这是一个很好的问题，我认为没有一个答案。最终，这取决于开发人员或开发团队。作为一种实践，我认为，是的，承诺错误应该在调度时处理/捕获。这就是为什么...

在您的示例中，您没有捕获承诺错误。正如您所解释的，您只处理减速器中的错误。

case `${RECEIVE_POSTS}_REJECTED`:
            return Status.REJECTED;

您读取具有该类型的对象${RECEIVE_POSTS}_REJECTED并将更改写入状态。当您将更改写入状态时，您（大概会更新 UI 和/或调度副作用来处理错误。这是 Redux 的典型实现。

然而，实际的承诺在这次实施中仍然没有兑现。为了捕获承诺错误，您需要在调度时（或在中间件中）执行此操作。

dispatch(myAsyncActionCreator()).catch(function(error) {
  // do something with the error
})

如果您在调度时发现错误，则不会在控制台中看到错误。这种做法冗长但简单/明确，让其他开发人员清楚如何处理错误。我相信清晰度对于可维护性和未来的变化很重要，因此我主张在调度时捕获错误。

希望有帮助！