我有以下组件树:
<BrowserRouter>
<Suspense fallback={<h1>MyFallback</h1>}>
<Switch>
<Route component={HomePage} path="/" exact />
<Route
component={lazy(() => import('./pages/Auth/Login'))}
path="/auth/login"
exact
/>
</Switch>
</Suspense>
</BrowserRouter>
我正在使用 React.Suspense
显示加载后备。但是,现在我想在当前页面的顶部显示一个进度条,而不是使用正常的 Suspense 加载回退,这会删除整个当前路由以显示回退。
如何添加 NProgress,例如,指示正在加载的页面的加载进度?
也许新的 React 的并发模式可以帮助解决这个问题? :)
最佳答案
解决方法
const LazyLoad = () => {
useEffect(() => {
NProgress.start();
return () => {
NProgress.stop();
};
});
return '';
};
<Suspense fallback={<LazyLoad />}>
关于javascript - 将 NProgress 与 "React.lazy"一起使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56640899/