Javascript Router
A vanilla js router implementation
A simple Javascript UI router. Written in typescript and bundled as a es6 module for use with Webpack or Rollup.
Installation
Install using npm and webpack/rollup etc.
npm install javascript-router
Import as module.
import { Router } from 'javascript-router';
Usage
Init
const prefix = '/hello';
const router = new Router(prefix);
Add routes to the router.
router.on('/', () => {
// Perform action on route
});
On functions can be chained.
router.on('/blog', () => {
// Perform action on router
}).on('/posts', () => {
// Perform action on router
});
When all routes are added call init().
router.on('/blog', () => {
// Perform action on router
}).on('/posts', () => {
// Perform action on router
});
router.init();
To create router links use the data-router attribute on link elements.
<a href="/blog" data-router>Link</a>
If the DOM is re-rendered or more links are added to the page the redefineLinks function must be called again.
router.redefineLinks();
Parameters and queries are passed into the .on() function.
router.on('/blog', (query, params) => {
// Perform action on router
console.log(query, params);
});