Могу ли я импортировать и отображать в +layout.svelte несколько фрагментов, кроме Children(), которые определены в +page ⇐ Javascript

[Anonymous]

Новичок в SvelteKit и пытаюсь разобраться в этой части...
Я пытался добиться этого несколькими способами, но боковая панель либо не загружается, либо навигация почему-то появляется дважды; при этом текст фрагмента появляется только во втором экземпляре. Я начал искать примеры на Github по пути:**/+layout.svelte /@render Children/ и пути:**/+layout.svelte /children: Snippet; *: Фрагмент, но нет результатов, которые фактически импортируют и используют повторяющиеся рендеры; из того, что я видел. Я планировал использовать +layout.svelte, чтобы разбить свой сайт на заголовок, боковую панель, главный и нижний колонтитул и динамически изменять контент на основе +page.svelte. В документации это затрагивается, и я видел, как это делается с помощью карточек и +page.svelte, но не в самом +layout.svelte. Я делаю это неправильно?
+layout.svelte

Код: Выделить всё

import "../app.css";
import type { Snippet } from "svelte";
import { sineIn } from "svelte/easing";
import { Drawer, Sidebar } from "flowbite-svelte";

// Destructure specific props from $props()
interface Props {
children?: Snippet;
filterSidebar?: Snippet void]>;
}
let {
children,
filterSidebar
}: Props = $props();

const transitionParams = {
x: -320,
duration: 200,
easing: sineIn
};

let hidden = $state(true);

function toggleSidebar(): void {
hidden = !hidden;
}


SvelteKit Render Test








{@render filterSidebar?.(toggleSidebar)}



{@render children?.()}

+page.svelte v1

Код: Выделить всё

import Layout from "./+layout.svelte";
import { CloseButton, SidebarGroup } from "flowbite-svelte";=

{#snippet filterSidebar(toggleSidebar: () => void)}

Filters


{/snippet}
Test Element

Результаты +page.svelte v1


+page.svelte v2< /p>

Код: Выделить всё

import Layout from "./+layout.svelte";
import { CloseButton, SidebarGroup } from "flowbite-svelte";
console.log("Page rendered");


{#snippet filterSidebar(toggleSidebar: () => void)}

Filters


{/snippet}
Test Element

Результаты +page.svelte v2


Подробнее здесь: https://stackoverflow.com/questions/793 ... ayout-svel