react-lodable 本身是通过高阶组件来实现的
高阶组件实现了模块加载、loading 状态以及错误处理的功能
- loader:用于传入一个加载器回调,在组件渲染到页面时被执行
- loading:表示用于显示加载状态的组件
- 在模块加载完成之前,加载器就会渲染这个组件
- 如果模块加载失败,那么 react-loadable 会将 errors 属性传递给 Loading 组件
- 根据错误状态来显示不同的信息给用户 ```jsx import Loadable from “react-loadable”;
// 创建一个显示加载状态的组件 function Loading({ error }) { return error ? ‘Failed’ : ‘Loading’; }
// 创建加载器组件 const HelloLazyLoad = Loadable({ loader: () => import(“./RealHelloLazyLoad”), loading: Loading, }); ``` https://www.cnblogs.com/cckui/p/11492510.html