A router module for building large single-page-application.
or
npm install spa-router-better --save
| Current URL | Matching rules | Matching params | Matching query |
|---|---|---|---|
| Name | Rules | URI |
|---|---|---|
| Home | / | / |
| Product List | /product | /product |
| Category Product List | /product/:color(r.+)-:size-:price | /product/red-small-low |
| Category Product List With Query | /product | /product?color=red&size=small&price=low |
| Product Detail | /product/:id | /product/12345 |
| About | /about | /about |
| Admin Home | /admin | /admin |
| Admin Product List | /admin/product | /admin/product |
| Admin Product List With Query | /admin/product | /admin/product?page=3 |
| Admin Category Product List | /admin/product/:color-:size-:price | /admin/product/red-small-low |
| Admin Category Product List With Query | /admin/product/:color-:size-:price | /admin/product/red-small-low?page=2 |
| Admin Product Add | /admin/product/:id | /admin/product/add |
| Admin Product Edit | /admin/product/:id | /admin/product/12345 |
| Not Found | none | /notfound |
const routesTable = {
'/': [callback1, callback2],
'/product': callback,
'/product/:color(r.+)-:size-:price': callback,
'/product/:id': callback,
'/about': callback,
};
let routerA = new Router(routesTable);
// use .mount() to dynamicly mount a sub-route
routerA.mount('/admin', {
'/': callback,
'/product': {
'/': callback,
'/:color-:size-:price': callback,
'/:id': callback,
'/add': callback
}
});
routerA.start({
notFound: notFoundCallback
});
// .route() & .dispatch()
routerA.on('/whatever/foo', callback)
.on('/whatever/bar', callback)
.dispatch('/whatever/bar');