Rei Tin Tin
Rei Tin Tin is a minimalistic router for single-page applications which uses fragment portion of the URL to display content.
Usage
Quick usage example below. See file example.html
for more detailed one.
import ReiTinTin from 'reitintin'; const renderHomePage = () => { const element = document.createElement('div'); ... return element;}; const renderAboutPage = () => { const element = document.createElement('div'); ... return element;}; ReiTinTin() .route('', renderHomePage) .route('about', renderAboutPage) .install(document.querySelector('#root'));
ReiTinTin()
Constructs and returns a new router configuration.
route( path, callback )
Registers new route which uses given callback function to render contents for that path. path-to-regexp is used for path matching (same as is used in Express.js) and any path parameters are passed to the callback function as arguments.
Any HTMLElement returned by the callback function will be used as contents
to be displayed, when user navigates to the path. If the callback function
returns either null
or undefined
, the container element will be just
cleared and no content will be displayed.
If asterisk (*
) is given as path, the route will be treated as fallback route
which will be used if user navigates to a path that doesn't otherwise exist.
install( container )
Installs the router so that it listens for URL hash changes and renders contents to given container element.
uninstall()
Removes the URL hash listener so that the router will no longer be used.