Skip to content

hi-plan/hi-router

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

50 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Build Status Coverage Status

Hi-Router

A Tiny Front End Router.

Example

<script src="../lib/router.js"></script>
<script>
	var router = new Router();
	router.on({
	  '/author': function() {
		  console.log('/author route');
	  },

	  '/about/(.*)?': function(id) {
	    console.log('/about route, id:', id);
	  },

	  '/aboutme/(.*)?/(.*)?': function(id, name) {
	    var retId = id;
	    var retName = name;
    }
	});

	router.go('/');
	router.go('/author');
	router.go('/about');

	// OR, we can add a route like this.
	router.on('/page', function() {
		console.log('/page route');
	});
</script>

API Reference

  • Import It's exported by UMD. We could use it by AMD, Common JS require, or directly import through <script> tag in the browser environment.

  • Router Initialize After imported, we could initialize it like:

var router = new Router({
	mode: 'history',  // 'history' or 'hash'
	root: '/'  // by default
});

// We could also init in this way.
var router = new Router();
router.config({
	mode: 'history',  // 'history' or 'hash'
	root: '/'  // by default
});
  • Use it
router.on('/page', function() {
	console.log('/page route');
});

// Or,we could dispatch a bunch of routes.
router.on({
	'/author': function() {
		console.log('/author route');
	},

	'/about/(.*)?': function(id) {
		console.log('/about route, id:', id);
	}
});

go to specified path.

router.go('/author');
  • Re-initialize
router.flush();

Development

npm install

npm run build

About

Front End Router Implementation.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published