Skip to main content
基本 Svelte
介绍
反应性
属性
逻辑
事件
绑定
类和样式
动作
转换
高级 Svelte
高级反应性
重用内容
运动
高级绑定
高级转换
上下文 API
特殊元素
<script module>
后续步骤
基本 SvelteKit
介绍
路由
加载数据
标题和 cookie
共享模块
表单
API 路由
$app/state
错误和重定向
高级 SvelteKit
钩子
页面选项
链接选项
高级路由
高级加载
环境变量
结论

加载数据 章节中,我们了解了如何从 +page.js+page.server.js+layout.js+layout.server.js 文件中导出 load 函数。我们还可以从这些模块导出各种页面选项:

¥In the chapter on loading data, we saw how you can export load functions from +page.js, +page.server.js, +layout.js and +layout.server.js files. We can also export various page options from these modules:

  • ssr — 页面是否应该由服务器渲染

    ¥ssr — whether or not pages should be server-rendered

  • csr — 是否加载 SvelteKit 客户端

    ¥csr — whether to load the SvelteKit client

  • prerender — 是否在构建时预渲染页面,而不是每个请求

    ¥prerender — whether to prerender pages at build time, instead of per-request

  • trailingSlash — 是否删除、添加或忽略 URL 中的尾部斜杠

    ¥trailingSlash — whether to strip, add, or ignore trailing slashes in URLs

在接下来的练习中,我们将依次了解这些内容。

¥In the following exercises, we’ll learn about each of these in turn.

页面选项可以应用于单个页面(如果从 +page.js+page.server.js 导出),或页面组(如果从 +layout.js+layout.server.js 导出)。要为整个应用定义选项,请从根布局中导出它。子布局和页面会覆盖父布局中设置的值,因此 — 例如 — 你可以为整个应用启用预渲染,然后为需要动态渲染的页面禁用它。

¥Page options can apply to individual pages (if exported from +page.js or +page.server.js), or groups of pages (if exported from +layout.js or +layout.server.js). To define an option for the whole app, export it from the root layout. Child layouts and pages override values set in parent layouts, so — for example — you can enable prerendering for your entire app then disable it for pages that need to be dynamically rendered.

你可以在应用的不同区域中混合搭配这些选项 - 你可以预渲染营销页面,动态服务器渲染数据驱动页面,并将管理页面视为客户端渲染的 SPA。这使得 SvelteKit 非常通用。

¥You can mix and match these options in different areas of your app — you could prerender your marketing pages, dynamically server-render your data-driven pages, and treat your admin pages as a client-rendered SPA. This makes SvelteKit very versatile.

上一页 下一页
1
2
<h2>Page options</h2>