react项目开发中，一个页面 调用了多个接口怎么去优化？

Question

react项目开发中，一个页面 调用了多个接口怎么去优化？

react项目开发中，一个页面 调用了多个接口，
如：page 要调用 A->B->C 接口初始化页面，而且 A ,B ,C 接口 不止在页面初始化是用到
在交互操作中也用到了，目前我是这样处理的

init----> dispatch(A),dispatch(B),dispatch(C)
有时候会出现链式 dispatch(A)->dispatch(B),dispatch(C)

不知道这样处理会不会出现性能问题，怎么去优化呢？

Answer 1

接口交给redux去处理。页面只从redux中拿数据就好了。

Answer 2

可以考虑Promise

Answer 3

我只是写出一种解决思路。我这里假定你的A、B、C都返回一个promise，利用Promise.all来做，你说的 A ,B ,C 在交互操作中也用到，那就交互时候该咋办还咋办。不影响初始化页面。

componentDidMount() {
      const actionsCreators= [A,B,C]
      const promiseArr = []
      for (const v of actionsCreators) {
        promiseArr.push(dispatch(v))
      }
      Promise.all(promiseArr).then(() => {
          // 都完毕时再做初始化，例如数据赋值的操作
      })
}