@slimkit-ui/router
v1.0.0
Published
Client side router for SPA applications written in Javascript
Downloads
1
Readme
Slimkit Router
Simple SPA router written in javascript
Install
npm i @slimkit-ui/router
Define your routing data
export let routeData = {
"/": { component: async () => [await import('./pages/Form.svelte'), { }] },
"/about": { component: async () => [await import('./pages/About.svelte')] },
"/store": {
'/cat': {
component: async () => [await import('./pages/store-inventory/ListCategory.svelte')],
'/:id': {
component: async (args) => {
let params = args.id == 'new' ? {} : { isEdit: true, catId: args.id }
return [await import('./pages/store-inventory/Category.svelte'), params]
},
}
},
}
}
Initialize the router
<script>
import { init, navigate } from "@slimkit-ui/router";
import { onMount } from "svelte";
import { currentPage, pageParams } from "./stores/page.store";
onMount(async ()=>{
let routingData = await init({...routeData})
pageParams.set({...routingData.params})
currentPage.set(routingData.module)
})
async function onLinkClick(event) {
let {module, params} = await navigate(event.detail)
pageParams.set({...params})
currentPage.set(module)
}
<script>