调用Axios,然后为每个返回的项目调用单独的Axios调用

时间:2018-02-19 15:58:41

标签: reactjs redux

我的Axios调用更新,但请求返回到我的reducer。问题是第一个axios调用更新了我的状态,然后我的第二组promises没有立即更新我的组件。

export function selectRoutingBooks(routing) {
    const url = `${ROOT_ROUTINGS_URL}/${routing.RoutingId}/${routing.VersionId}/books`;
    let promises = [];
    const request = axios.get(url).then((response)=>{
        response.data.map((item)=>{
            const url2 = `${ROOT_ITEMS_URL}/${item.MatItemKey}?all=true`;

            promises.push(axios.get(url2));
        });
        axios.all(promises).then(function(results) {
            results.forEach(function(res) {

                let common = response.data.find(x=>x.MatItemKey === res.data.base.ItemKey);


                let newCommon = {...common, ...res.data};


                var i = response.data.findIndex(o => o.MatItemKey === newCommon.base.ItemKey);
                if (response.data[i]) { response.data[i] = newCommon }

            })
        });
        return response
    });

    return {
        type: ROUTING_BOOKS,
        payload: request

    }
}

我不完全确定如何获得所有承诺同时更新我的​​州。当我办理登机手续时

componentWillUpdate(){
    console.log("Component will update RoutingDetail", this.props.routingBooks)
}

我正在获取所有数据,但道具不会在这里更新。

TIA

2 个答案:

答案 0 :(得分:0)

我找到了解决问题的方法。我需要将Promise.all返回给reducer。

<IfModule mpm_prefork_module>
    StartServers     3
    MinSpareServers  3
    MaxSpareServers  5
    MaxRequestWorkers 25
    MaxConnectionsPerChild   1024
</IfModule>

而不是

return Promise.all(promises).then(function(results) {

当promise.all完成时,这会更新我的reducer。

答案 1 :(得分:-1)

我认为你应该使用Promise.all()来做你想做的事情,或者如果你使用的是ES7,可能会async await

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all