@gluonjs/router / packages/router/src / useRoute
Function: useRoute()
useRoute():
RouteLocationNormalized
Returns
Example
Read the current normalized route while an application render runs under an installed Router plugin:
import { createApp, html, inject } from '@gluonjs/core';
import {
RouterLink,
RouterView,
createMemoryHistory,
createRouter,
createRouterPlugin,
routerKey,
useRoute,
useRouter,
type RouterLinkProps,
type RouterViewProps,
} from '@gluonjs/router';
const router = createRouter({
history: createMemoryHistory(['/shop']),
routes: [{ path: '/shop', component: () => html`<h1>Shop</h1>` }],
});
const link = { to: '/shop', children: 'Shop', activeClass: 'is-active' } satisfies RouterLinkProps;
const view = { fallback: html`<p>Not found</p>` } satisfies RouterViewProps;
const app = createApp(() => {
const current = useRoute();
console.log(useRouter() === inject(routerKey), current.fullPath);
return html`<nav>${RouterLink(link)}</nav><main>${RouterView(view)}</main>`;
});
app.use(createRouterPlugin(router));
app.mount(document.querySelector('#app')!);