批量异步请求获取数据方法

批量请求优化：异步数据协同获取与同步设置

最新推荐文章于 2025-03-30 00:12:12 发布

原创最新推荐文章于 2025-03-30 00:12:12 发布 · 473 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

react 专栏收录该内容

22 篇文章

订阅专栏

本文介绍如何在前端页面初始化时并行执行方法A、B和C，确保在C请求中正确使用A和B的结果。通过Promise.all管理和同步数据，解决数据获取延迟问题。

批量异步请求获取数据方法

背景：有方法A，B，C，在我请求C的时候我需要方法A以及方法B的结果做的传参
现象：在页面一加载执行的方法里面分别写入三个方法，按顺序写入，将方法AB的结果放到setstate里面，但是C执行的时候请求接口的参数并没有从ABset进去的获取值获取
解决方案：

 const dataIdPromise = getCorrelationData(
              params,
              editModeCorrelationViews
            );
            const formIdPromise = getCorrelationId(config);
            Promise.all([dataIdPromise, formIdPromise])
              .then(res => {
                const [dataId, formId] = res;
                setCorrelationDataId(dataId);
                return { dataId, formId };
              })
              .then(({ dataId, formId }) => {
                queryCorrelationEditInfo(dataId, formId);
              })
              .catch(err => {
                console.error(err);
              });