Skip to content

Latest commit

History

History
23 lines (19 loc) 路 1.65 KB

react-dynamic-import.md

File metadata and controls

23 lines (19 loc) 路 1.65 KB

DynamicImportWrapper(options)

Dynamically load any react module(Component or an HOC)

Kind: global function

Param Type Default Description
options Object Options passed to react dynamic import functions
options.loader function function which takes module name and returns promise to resolve module
[options.isHOC] Boolean false Is the module an HOC?
[options.name] String Dynamic module to be fetched(Mostly it will be part of the module file name), optional if loader returns same component every time
[options.placeholder] Component defaultPlaceholder React component to be rendered until actual module is fetched (You can add UX improvements like adding small delay before showing loader inside your class/functional component)
[options.errorHandler] Component defaultErrorHandler React component to be rendered if fetching actual module fails. This will receive name and error object as props

Example

- Module loader function
     const loader = f => import(`./dynamic/${f}.js`);
 - Use dynamic module(Make sure to use it outside render method, else new component is rendered in each render)
     const RealComponent = DynamicImport({ name: 'realModuleName', loader }),