Last active
July 26, 2017 09:58
-
-
Save lsjroberts/55e79270b8cf6b26c43f5a335058f615 to your computer and use it in GitHub Desktop.
Dynamic loading helpers for React Router
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const loadRoute = (next) => | |
| (module) => | |
| next(null, module.default); | |
| const loadRoutes = (next) => | |
| (modules) => | |
| next(null, modules.map(module => module.default)); | |
| const loadRouteComponent = (importer) => | |
| (location, next) => | |
| importer() | |
| .then(loadRoute(next)) | |
| .catch(console.error); | |
| const route = (path, importer) => ({ | |
| path, | |
| getComponent: loadRouteComponent(importer), | |
| }); | |
| const routes = (config) => | |
| Object.keys(config).map(path => | |
| route(path, config[path]) | |
| ); | |
| export { | |
| loadRoute, | |
| loadRoutes, | |
| loadRouteComponent, | |
| route, | |
| routes, | |
| }; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { routes } from './route-helpers'; | |
| import App from './components/app'; | |
| const rootRoute = { | |
| component: App, | |
| childRoutes: routes({ | |
| '/': () => System.import('./home'), | |
| about: () => System.import('./about'), | |
| blog: () => System.import('./blog'), | |
| }), | |
| }; | |
| export default rootRoute; |
Found the solution: indexRoute: { onEnter: (nextState, replace) => replace('/home') },
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks for this tip. I'm moving my applications to use this methodology but I'm facing a problem that I don't know how to solve. The static approach allows to do
<IndexRedirect to="home" />so when the user goes to/ends up at/home. Any idea how to do the "index redirect" with the dynamic-routes-object?