Files
ohif-viewer/platform/viewer/src/components/AsyncComponent.js
T

37 lines
805 B
JavaScript
Raw Normal View History

2019-04-29 08:31:40 -04:00
/**
* We use this component to leverage "Code Splitting"
*
* Link: https://serverless-stack.com/chapters/code-splitting-in-create-react-app.html
*/
2019-05-29 08:39:54 -04:00
import React, { Component } from 'react';
2019-04-29 08:31:40 -04:00
export default function asyncComponent(importComponent) {
class AsyncComponent extends Component {
constructor(props) {
2019-05-29 08:39:54 -04:00
super(props);
2019-04-29 08:31:40 -04:00
this.state = {
component: null,
2019-05-29 08:39:54 -04:00
};
2019-04-29 08:31:40 -04:00
}
async componentDidMount() {
// Add dynamically loaded component to state
2019-05-29 08:39:54 -04:00
const { default: component } = await importComponent();
2019-04-29 08:31:40 -04:00
this.setState({
component: component,
2019-05-29 08:39:54 -04:00
});
2019-04-29 08:31:40 -04:00
}
render() {
2019-05-29 08:39:54 -04:00
const C = this.state.component;
2019-04-29 08:31:40 -04:00
// Render the loaded component, or null
2019-05-29 08:39:54 -04:00
return C ? <C {...this.props} /> : null;
2019-04-29 08:31:40 -04:00
}
}
2019-05-29 08:39:54 -04:00
return AsyncComponent;
2019-04-29 08:31:40 -04:00
}