Nitrate Processed Mincemeat

    vanilla-router
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.8 • Public • Published

    vanilla-router

    NPM

    NPM

    Description

    Simplest One Page Application Router for those who want to use it on Vanilla JS

    Note: If you want to use the IE compatible version use v1.1.5

    Installation

    NPM

    npm install vanilla-router --save

    Bower

    bower install vanilla-router --save

    Usage

    var router = new Router({
        mode: 'history',
        page404: function (path) {
            console.log('"/' + path + '" Page not found');
        }
    });
     
    router.add('', function () {
        console.log('Home page');
    });
     
    router.add('hello/(:any)', function (name) {
        console.log('Hello, ' + name);
    });
     
    router.add('about', function () {
        console.log('About Page');
    });
     
    router.addUriListener();
     
    router.navigateTo('hello/World');

    Options

    mode string

    Default: "history" .

    • hash - is for hashbang routes based on window.location.hash
    • history - is for clean url routes based on HTML5 functionality. It is also provide back-compatibility for old browser.

    root string

    Default: "/" .

    Root represents the relative path for the project root.

    page404 function

    Default: function that log an error in console.

    Callback function for 404 page

    routes Array

    Default: [ ]

    Warning! Use it only if you have all stack with RegExp routes.

    Methods

    Every public methods of Router return the instance of Router, so they can be chained.

    add(path, handler, options)

    Add a route and handler for this route

    Parameters
    • path - string | RegExp
    • handler - callback if the URL will match the path
    • options - object, you can specify before unload callback

    string path can contain:

    • parenthesis (( )) - value between them is sent to callback function
    • wildcards (:any, :num, :word) it doesn't pass the value to callback function
    • named placeholder ({variableName}) it pass the value to the callback function
    router.add('hello/world', function(){ });
    router.add('hello/:word', function(){ });
    router.add('hello/(:word)', function(name){ });
    router.add('hello/{name}', function(name){ });
    router.add(/^hello\/(\w+)/i, function(name){ });

    remove(path)

    Remove the route from current list of routes by path

    navigateTo(path[, state[, silent]])

    Navigate to the specific URI with optional additional state of page silent is a flag, set as true, to skip check for new URL

    check()

    Check the current URL for a change

    back()

    Simulate the browser "Back" button

    forward()

    Simulate the browser "Forward" button

    go(step)

    Go to a specific step in history

    refresh()

    Recall current route handler with same arguments

    addUriListener()

    Add the event listener for URL change

    removeUriListener()

    Remove the event listener for URL change

    reset()

    Reset all setting and state of Router

    Licence

    Released under the MIT license

    Copyright (c) 2016 Grigore Odajiu

    Install

    npm i vanilla-router

    DownloadsWeekly Downloads

    96

    Version

    1.2.8

    License

    MIT

    Unpacked Size

    53 kB

    Total Files

    13

    Last publish

    Collaborators

    • graidenix