在redux 中，通过中间件，循环执行多个ajax，如何确保回调结果是按照顺序来的

Question

最近在用react+redux开发webapp，其中在处理ajax这块，一直存在疑惑。
需求是：

其中采用标准fetch发送ajax，异步采用redux-thunk 处理异步promise。
middleware :

在组件A中。循环props.发送请求：

然后通过componentWillReceiveProps 获取ajax 的回调：

现在问题，setSate的结果是ajax回调的最后一次结果，最终渲染的列表都是最后一个ajax返回的那个值，不是对应的每个item的值。

不知道大家写redux的时候是怎么处理这种情况的。感觉redux在处理多个ajax请求的时候比较蛋疼，不像传统的写法，循环后，异步回调后，就是对应的每一步的结果了。

求教！

Answer 1

里面的promise.then建议改成Promise.all().then

Answer 2

这个应该通过action来解决。

我想你的场景是这样的，获取数据集合ListA，针对集合中的每一项发送请求获取更多数据，组成集合ListB。
ListB才是view真正想要的数据。

针对这种情况，action中应该像下面的这样
假设有一个fetchData的async action，他的payload是个promise，那剩下的其实都是对promise的处理了。
伪代码

// action
fetchData = (dispatch) => dispatch({payload: fetchListA.then(fetchMore)})

// promise
fetchListA = () => fetch(...)

// more是个数组，包含每个item的更多信息
fetchMore = (listA) => Promise.all(listA.map(item => fetchItem(item)))
                              .then(more => merge(listA, more))

fetchItem = (item) => fetch(...)

merge = (list, more) => {...}

如果有必要，获取ListA和更多信息都可以作成独立action进行dispatch