react、redux中用于多个异步调用的单个reducer

Question

我从React js:中的一个组件多次调用单个post请求，如下所示

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是在动作创建者中编写的一个动作，它调用redux saga，根据帐户的数量异步调用多次。所以，如果说账户数量是5，那么我调用的post请求是使用redux saga异步调用5次。

问题是，当我的post请求成功返回时，我再次调用成功操作，该操作调用reducer，并将数据提供给我的组件。但由于调用了5次，并且调用了相同的成功函数和相同的reducer。它会覆盖以前的调用结果。示例：如果我的第一个请求返回结果，第二个请求则返回结果。我的第一个请求结果在reducer中被覆盖。

有人能帮我如何在单个reducer中维护所有5个请求的结果吗。

Answer 1

您需要在数组中添加结果，而不是在数组中覆盖。假设你有状态。

const state = {
accountDetails =[]
}

在reducer-In-success调用中，您可以推送accountDetails和更新状态中的新数据。

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