异步加载组件

42 阅读1分钟
{/* 第一种 异步加载组件 */}
const UseContext = React.lazy(() => import('./views/Context.jsx'));//往import最后放

<Route path='/context' element={<Suspense fallback={<Loading></Loading>}>
        <UseContext></UseContext>
</Suspense>}></Route>
// 第二种异步加载  可以不使用Suspense  但是需要安装依赖 @loadable/component
import loadable from '@loadable/component';

const UseContext = loadable(() => import('./views/Context.jsx'), {
  fallback: <Loading></Loading>
})
  
  
  <Route path='/context' element={<UseContext />}></Route>