JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://canjs.com/release/latest/can.jquery.js"></script>

JavaScript

var Router = can.Control({
    'init': function() {
    },
    'route' : function(){
       $(document.body).append("moving to dashboard...<br>");
       window.location.hash = '#!dashboard';
    },
    'dashboard route': function() {
        $(document.body).append("Dashboard");
    }
});

$(document).ready(function() {
    /*
    new Router($("body"));
    can.route.ready();
    */
        // Before we start, empty the hash.
    window.location.hash = '';
    // This means that can.route is empty.
    can.route.attr(); // {}
    // Set the hash...
    window.location.hash = '#!id=7';
    // ...and can.route reflects that.
    can.route.attr(); // {id: 7}
    // Set the route...
    can.route.attr({type: 'todos'}, true);
    // ...and the hash reflects that.
    window.location.hash; // #!type=todos
    // Set a new property on the route...
    can.route.attr('id', 6);
    // ...and the has changes again to reflect multiple properties.
    console.log(window.location.hash); // #!type=todos&id=6
});