Nerfed Poet Melancholia

    bem-history

    4.0.0 • Public • Published

    bem-history

    What is this?

    BEM wrap for History API:

    • supports browsers with a native History API and hashchange event;
    • provides manipulations with url, browser location and history in the terms of BEM.

    Components

    • uri__querystring – module for an url parsing;
    • history – module provides work with a browser History with two modificators:
    • provider_history-api – supports a native History API;
    • provider_hashchange – supports fallback on the hashchange event;
    • location – high-level module for a window.location change.

    Scheme of library work

    bem-history workflow

    Usage

    uri__querystring

    modules.require(['uri__querystring'], function(Querystring) {
     
        // Parse url
        var u = Querystring.Uri.parse('http://example.org:8080/path?test=1&test=2&param2=22');
     
        // Change port
        u.setPort(80);
     
        // Change query params
        u.deleteParam('test', '2');
        u.replaceParam('param2', 2);
     
        // Serialize url
        u.toString(); // "http://example.org:80/path?test=1&param2=2"
     
    });

    history

    modules.require(['history'], function(History) {
     
        // Create history instance
        var history = new History();
     
        // Push new or replace history state
        history.changeState('push', { title: 'Title', url: 'http://example.org:8080/path' });
        history.changeState('replace', { title: 'Title', url: 'http://example.org:8080/path?test=1' });
     
    });

    location

    modules.require(['location'], function(location) {
     
        // Change `window.location` using a full url
        location.change({ url: 'http://example.org:8080/path' });
     
        // Change current location using only the new query params
        location.change({ params: { param1: [11,12], param2: 'ololo' } });
        window.location.href; // "http://example.org:8080/path?param1=11&param1=12&param2=ololo"
     
    });

    Install

    npm i bem-history

    DownloadsWeekly Downloads

    6

    Version

    4.0.0

    License

    MPL-2.0

    Last publish

    Collaborators

    • tadatuta