tg-named-routes
v1.0.0-beta.4
Published
React Router named routes helper
Downloads
52
Readme
tg-named-routes
React Router 4/5 named routes helper library to add support for named routes via react-router-config. Also provides named versions of React-Router components.
Usage
// routes.js
import {buildUrlCache} from 'tg-named-routes';
const routes = [
{
component: App,
routes: [
{
path: '/',
name: 'landing',
render: props => null,
}
],
}
];
buildUrlCache(routes);
export default routes;
// client.js
import {RenderChildren} from 'tg-named-routes';
import routes from './routes';
hydrate(
<BrowserRouter>
<RenderChildren routes={routes} />
</BrowserRouter>,
document.getElementById('root'),
);
// App.js
const App = ({route}) => (
<RenderChildren routes={route.routes} />
);
export default App;
// For more complex patterns use `react-router-config` directly:
// import { renderRoutes } from 'react-router-config';
const App = ({route}) => (
{renderRoutes(route.routes)}
);
// And render you have an option to render links with names
import {Link} from 'tg-named-routes';
const FooBar = () => (
<Fragment>
<Link name="landing" />
</Fragment>
);