javascript 在react中使用一个reducer来实现多个recruitc调用,redux

3pmvbmvn  于 12个月前  发布在  Java
关注(0)|答案(1)|浏览(97)

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

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

requestAccountDetails is a function written in const mapDispatchToProps in container:

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

字符串
requestAcountDetailsInformation是在action creator中编写的一个action,它调用redux-saga,它会根据帐户的数量异步调用多次。所以,如果帐户的数量是5,那么我调用的post请求是使用redux-saga异步调用5次。
问题是当我的post请求成功返回时,我再次调用success action,它调用reducer,数据被提供给我的组件。但是由于调用了5次,它调用了相同的success函数和相同的reducer。它覆盖了以前的调用结果。示例:如果我的第一个请求返回结果,第二个请求返回结果。我的第一个请求结果在reducer中被覆盖。
谁能帮助我如何在一个reducer中维护所有5个请求的结果。

kxxlusnw

kxxlusnw1#

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

const state = {
accountDetails =[]
}

字符串
在reducer in success调用中,你可以在accountDetails中推送新数据并更新状态。

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

相关问题