SvelteKit 使用基于文件系统的路由,这意味着你的应用程序的 路由 —— 换句话说,当用户导航到特定 URL 时应用程序应该做什么 —— 是由你的代码库中的目录结构定义的。
在 src/routes
中的每个 +page.svelte
文件都会在你的应用程序中创建一个页面。在这个应用程序中,我们目前有一个页面 —— src/routes/+page.svelte
,它映射到 /
。如果我们导航到 /about
,我们会看到一个 404 Not Found 错误。
让我们来修复这个问题。添加第二个页面 src/routes/about/+page.svelte
,复制 src/routes/+page.svelte
的内容,并更新它:
src/routes/about/+page
<nav>
<a href="/">首页</a>
<a href="/about">关于</a>
</nav>
<h1>关于</h1>
<p>这是关于页面。</p>
现在我们可以在 /
和 /about
之间导航了。
与传统的多页面应用不同,导航到
/about
和返回只会更新当前页面的内容,就像单页应用程序一样。这给我们带来了两个优点 —— 快速的服务端渲染启动,然后是即时导航。(这个行为是可以配置的。)
上一页 下一页
1
2
3
4
5
6
7
8
<nav>
<a href="/">home</a>
<a href="/about">about</a>
</nav>
<h1>home</h1>
<p>this is the home page.</p>