Estoy desarrollando una aplicación usando svelte y uso tiendas personalizadas.
Sé que svelte maneja automáticamente la cancelación de suscripción si usamos $
<h1>The count is {$count}</h1>pero, como tengo que filtrar mi matriz en el script, ¿cómo puedo usar esta ventaja?
de
const filteredMenu = menu.filter("header");a
$: filteredMenu = menu.filter("header");?. o tal vez tengo que darme de baja manualmente en unMount hook?
Estoy incluyendo mi código
// /store/menu.ts import { writable } from "svelte/store"; import { myCustomFetch } from "@/utils/fetch"; import type { NavbarType } from "@/types/store/menu"; const createMenu = () => { const { subscribe, set } = writable(null); let menuData: Array<NavbarType> = null; return { subscribe, fetch: async (): Promise<void> => { const { data, success } = await myCustomFetch("/api/menu/"); menuData = success ? data : null; }, sort(arr: Array<NavbarType>, key: string = "ordering") { return arr.sort((a: NavbarType, b: NavbarType) => a[key] - b[key]); }, filter(position: string, shouldSort: boolean = true) { const filtered = menuData.filter((item: NavbarType) => ["both", position].includes(item.position) ); return shouldSort ? this.sort(filtered) : filtered; }, reset: () => set(null), }; }; export const menu = createMenu(); // Navbar.svelte <sript> const filteredMenu = menu.filter("header"); </script> {#each filteredMenu as item, index (index)} <a href={item.url} target={item.is_external ? "_blank" : null} class:link-selected={activeIndex == index}>{item.title} </a> {/each}