react懒加载

React 懒加载（Lazy Loading）是指在组件需要被渲染时才加载相应的代码。这有助于减少初始页面加载时的代码量，提高页面的性能。

在 React 中，可以使用 React.lazy() 函数来实现懒加载。React.lazy() 接收一个函数作为参数，这个函数返回一个动态 import() 语句，这个语句用于加载组件的代码。具体操作如下：

1. 创建一个需要懒加载的组件，比如 MyComponent。

2. 使用 React.lazy() 包装这个组件：

   ​
   const MyComponent = React.lazy(() => import('./MyComponent'));
   ​

3. 在需要渲染这个组件的地方，使用 <Suspense> 组件包裹它：

   import React, { Suspense } from 'react';
   
   const App = () => {
     return (
       <div>
         <Suspense fallback={<div>Loading...</div>}>
           <MyComponent />
         </Suspense>
       </div>
     );
   };

   这里的 fallback 属性指定了在组件加载过程中显示的占位符。可以根据需要自定义这个占位符。