0

我正在使用React.lazywithSuspense来设置加载。

const LazyComponent = React.lazy(() => {
  const x = new Promise((resolve) => {
    setTimeout(() => {
      return resolve(import("../Components/ListContainer"));
    }, 3000);
  });
  return x;
});

function Home() {
  return (
    <> 
      <Suspense fallback={<Loading />}>
        <LazyComponent />
      </Suspense> 
    </>
  );
}

在我的代码中,我将超时设置为3000,但我的目标是让它加载,直到它完全获取所有数据,然后一次呈现所有数据。

有没有办法做到这一点?还是有更好的方法来设置加载?

4

1 回答 1

0

您需要动态处理加载,而不是给出 setTimeout 的固定值。

> 以下是您执行此操作的步骤:

1- 为每个网络调用创建 3 个操作:像 getDataPending、getDataSuccess、GetDataError

2- 在 getDataPending 操作中将loading=false

3- 在 getDataSuccess 操作中将loading=true并设置Error=false

4- 在 getDataSuccess 操作中将loading=true并设置Error=true

5- 现在在网络调用之前调用 getDataPending

6-在获取响应时调用成功操作和失败的错误操作案例

这将帮助您实现动态加载

快乐编码

于 2021-06-14T10:04:22.513 回答