umijs / umi

A framework in react community ✨
https://umijs.org
MIT License
15.08k stars 2.64k forks source link

[Bug] src下的loading.tsx不生效 #11310

Closed snail-climb closed 1 year ago

snail-climb commented 1 year ago

src下的loading.tsx不生效

github-actions[bot] commented 1 year ago

由于缺乏足够的信息,我们暂时关闭了该 Issue。请修改(不要回复) Issue 提供最小重现以重新开启。谢谢。

fz6m commented 1 year ago

需要给一个最小复现

snail-climb commented 1 year ago

我用的umi max,所有的版本包括antd antdpro都是最新版的,loading.tsx内容就是一个非常基础的官方示例,代码如下: import { Spin } from 'antd';

const App: React.FC = () => ;

export default App; 我把浏览器网速调的很低,刷新时显示的是空白页,并没有显示加载状态

fz6m commented 1 year ago

给一个最小复现仓库看看吧,我把最新的 ant-pro 仓库克隆下来,加了 src/loading.tsx 是有效的。

snail-climb commented 1 year ago

仓库是这个,麻烦啦,https://github.com/snail-climb/dolphin-web

fz6m commented 1 year ago

我创建了一个 src/loading.tsx

// src/loading.tsx

import { Spin } from "antd";

export default function Page() {
  return (
    <Spin
      style={{
        width: "100%",
        height: "100%",
        display: "flex",
        justifyContent: "center",
        alignItems: "center",
      }}
      spinning
    ></Spin>
  );
}

然后访问页面 http://localhost:9000/#/login 是可以看到 loading 效果的。

src/loading.tsx 这个文件只能控制所有页面的按需加载动画,不能控制你自己写的页面里的,进入到某个页面后,这个 loading 就没有了,如果这个时候你异步加载地图,地图还没加载好的时候是白屏的,你需要自己展示 loading ,等加载好了再展示页面。

snail-climb commented 1 year ago

明白了,感谢