反應中多個異步調用的單個減速器，redux

Question

我從 React js 中的一個組件多次調用單個帖子請求，如下所示：

Object.keys(data).map(account => {
    const accountRequest = {
        accountNo: account.accountNo,
        id : account.id
    }
    return this.props.requestAccountDetails(accountRequest)
}

requestAccountDetails 是容器中用 const mapDispatchToProps 編寫的函數：

const mapDispatchToProps = (dispatch)  => {
    return {
        requestAccountDetails : (accountDetails)=> {
            dispatch(requestAccountDetailsInformation(accountDetails));
        }
    }
}

requestAcountDetailsInformation 是在 action creator 中編寫的 action，它調用 redux-saga，根據帳戶數量異步調用多次。 因此，如果說帳戶數為 5 ，則我調用的 post 請求是使用 redux-saga 異步調用的 5 次。

問題是當我的 post 請求成功返回時，我再次調用調用 reducer 的成功操作，並將數據提供給我的組件。但是由於調用了 5 次，它調用了相同的成功函數和相同的 reducer。它覆蓋了以前的調用結果。 示例：如果我的第一個請求返回結果，第二個請求返回結果。我的第一個請求結果在減速器中被覆蓋。

任何人都可以幫助我如何在單個減速器中維護所有 5 個請求的結果。

Answer 1

您需要在數組中添加結果而不是覆蓋其中。 假設你有狀態。

const state = {
accountDetails =[]
}

在成功調用的減速器中，您可以在 accountDetails 中推送新數據並更新狀態。

  reducer(initialState=state, action)
    switch(action.type){
      ....
    case Authsuccess: return { ...initialState,
                                accountDetails : [ 
                                ...initialState.accounDetails, 
                                 action.payload.accountInfo
                                 ],
                              }