Añadimos Router con .to.path.params.back

This commit is contained in:
2026-04-08 12:06:57 +02:00
parent 2ac429c3f8
commit 925a673775

29
sw.js
View File

@@ -1,4 +1,3 @@
const isFunction = (value) => typeof value === 'function'; const isFunction = (value) => typeof value === 'function';
const isNode = (value) => value instanceof Node; const isNode = (value) => value instanceof Node;
@@ -54,7 +53,7 @@ export const signal = (initialValue, storageKey = null) => {
if (storageKey && hasStorage) { if (storageKey && hasStorage) {
const saved = localStorage.getItem(storageKey); const saved = localStorage.getItem(storageKey);
if (saved !== null) try { currentValue = JSON.parse(saved); } catch {} if (saved !== null) try { currentValue = JSON.parse(saved); } catch { }
} }
const signalObject = { const signalObject = {
@@ -281,25 +280,29 @@ export const Transition = ({ enter, idle, leave }, { children: [child] }) => {
// --- Routing & Application Entry --- // --- Routing & Application Entry ---
export const Router = (routes) => { export const Router = (routes) => {
const currentPath = signal(window.location.hash.slice(1) || '/'); const path = signal(window.location.hash.slice(1) || '/'), params = signal({});
window.onhashchange = () => currentPath.value = window.location.hash.slice(1) || '/'; Router.path = path;
Router.params = params;
Router.to = (p) => window.location.hash = p;
Router.back = () => window.history.back();
window.onhashchange = () => path.value = window.location.hash.slice(1) || '/';
return h('div', { class: 'router-view' }, () => { return h('div', { class: 'router-view' }, () => {
const pathValue = currentPath.value; const cur = path.value;
for (const route of routes) { for (const r of routes) {
const pattern = new RegExp(`^${route.path.replace(/:[^\s/]+/g, '([^/]+)')}$`); const match = cur.match(new RegExp(`^${r.path.replace(/:[^\s/]+/g, '([^/]+)')}$`));
const match = pathValue.match(pattern);
if (match) { if (match) {
const params = {}; const p = {};
const keys = route.path.match(/:[^\s/]+/g) || []; (r.path.match(/:[^\s/]+/g) || []).forEach((k, i) => p[k.slice(1)] = match[i + 1]);
keys.forEach((key, index) => params[key.slice(1)] = match[index + 1]); untrack(() => params.value = p);
return h(route.component, { params, path: pathValue }); return h(r.component, { params: p, path: cur });
} }
} }
const fallback = routes.find(r => r.path === '*'); const fallback = routes.find(r => r.path === '*');
return fallback ? h(fallback.component) : '404'; return fallback ? h(fbk.component) : '404';
}); });
}; };
export const mount = (rootComponent, target, props = {}) => { export const mount = (rootComponent, target, props = {}) => {
const destination = typeof target === 'string' ? document.querySelector(target) : target; const destination = typeof target === 'string' ? document.querySelector(target) : target;
if (!destination) return; if (!destination) return;