我的网站上有多个页面,只有主页应该有不同的布局?我怎样才能做到这一点呢?
src/
- page1/ <- LayoutB
- page2/ <- LayoutB
- page3/ <- LayoutB
- index.svelte <- LayoutA
如果我在src/
文件夹中使用__layout.svelte
,它将适用于每个页面。
2022年11月更新
这个方法在
中进行了测试npm -v @sveltejs/kit
8.19.2
要为特定页面(或页面组)创建独特的布局,您需要使用group.
src/
routes/
(unauthenticated)/
welcome/
register/
login/
+page.svelte
+layout.svelte (this layout applies to welcome/, register/ and login/
(authenicated)/
home/
settings/
+page.svelte
+layout.svelte (this layout applies to home/, settings/ and dashboard/
+page.svelte
+layout.svelte (this layout applies to all pages in unauthenticated/ and authenticated/)
我能够找到一个解决方案,使用命名布局从SvelteKit
我的问题的解决方案是这样的
src/
- page1/ <- LayoutB
- page2/ <- LayoutB
- page3/ <- LayoutB
- __layout.svelte (LayoutB)
- __layout-main.svelte (LayoutA)
- index@main.svelte <- LayoutA
我创建了一个具有-main
后缀的布局文件,并使用此名称作为我的index@main.svelte
文件中布局的参考