Я пытаюсь выполнить разбиение кода в реакции маршрутизатора v4, используя реагирующую загрузку .
Я намерен добиться того, чтобы не заменять текущий вид загружаемым компонентом, а сохранять то, что отображается в данный момент. и изменять состояние только загруженного в данный момент компонента.
Есть ли способ добиться этого с помощью реагирующей нагрузки? Или, может быть, есть другая библиотека.
import Loadable from 'react-loadable';`
`import LoaderStripComponent from './LoaderStripComponent.jsx';`
`export default function Stage3Loadable(opts) {
var loadable = Loadable(Object.assign({
loading: LoaderStripComponent,
timeout: 10
}, opts));
return loadable;
};`
`<Swtich>
<Route exact path="/" component={Stage3Loadable({
loader: () => import('../components/HomeCoverPage.jsx'),
modules: ['.../components/HomeCoverPage.jsx'],
webpack: () => [require.resolveWeak('../components/HomeCoverPage.jsx')],
})} />
</Swtich>`
`class LoaderStripComponent extends React.Component {
componentDidMount() {
showLoader();
}
componentWillUnmount() {
hideLoader();
}
componentWillReceiveProps(nextProps) {
// console.log('>>>>>>>>>>>>', props.error);
}
render() {
return null;
}
}`
`function mapStateToProps(state) {
return {
device: state.device,
geolocation: state.geoLocation,
loader: state.routerLoading
};
}`
`function mapDispatchToProps(dispatch) {`
`return bindActionCreators({`
}, dispatch);
`}`
export default connect(mapStateToProps, mapDispatchToProps)(LoaderStripComponent);
Я хочу, чтобы эта LoadableStrip отображала ранее загруженный компонент до тех пор, пока не будет решено обещание импорта.