<h1 align="center">ncnbb-react-loadable</h1> <p align="center">React异步加载组件</p> <p align='center'> <img alt='npm' src='https://img.shields.io/npm/v/ncnbb-react-loadable'/> <img alt='NPM' src='https://img.shields.io/npm/l/ncnbb-react-loadable'/> <img alt='t
npm install ncnbb-react-loadableReact异步加载组件
``shell`
npm install ncnbb-react-loadable
插件,让webpack处理import()特殊Api
- 被加载的组件必须使用export default进行导出
- 需要使用react16版本及以上$3
| 属性 | 说明 | 类型 | 默认值 |
| -------- | ------------------------------------- | ------------------------------------------------------------------- | ------ |
| loader | 异步获取组件函数,必须返回一个promise | Function | 必传 |
| loading | 加载中展示组件 | JSX.Element、JSX.Component | null |
| error | 加载错误展示组件 | JSX.Element、JSX.Component | null |
| overTime | 加载超时展示组件 | JSX.Element、JSX.Component | null |
| timeout | 超时时间 | number | null |
| delay | 延迟加载时间 | number | null |
| callback | 状态回调 | Function(status: 'done'\|'error'\|'overTime', error: Error \| null) | null |
$3
`jsximport loadable from 'ncnbb-react-loadable';
const LoadableComponent = loadable( {
loader: () => import( './Sub.jsx' ),
loading: Loading,
timeout: 2000,
delay: 3000,
error: Error,
callback: (status, error) => {console.log(status)},
overTime:
} );
render () {
return (
);
}``