$app/state
SvelteKit 通过$app/state模块提供三个只读状态对象 —— page、navigating和updated。
[注意] 此模块添加于 2.12 版本。如果您使用的是 SvelteKit 的早期版本，请使用
$app/stores代替。
import { const navigating: Navigation | {
from: null;
to: null;
type: null;
willUnload: null;
delta: null;
complete: null;
}
A read-only object representing an in-progress navigation, with from, to, type and (if type === 'popstate') delta properties.
Values are null when no navigation is occurring, or during server rendering.
navigating, const page: Page<Record<string, string>, string | null>A read-only reactive object with information about the current page, serving several use cases:
- retrieving the combined
data of all pages/layouts anywhere in your component tree (also see loading data)
- retrieving the current value of the
form prop anywhere in your component tree (also see form actions)
- retrieving the page state that was set through
goto, pushState or replaceState (also see goto and shallow routing)
- retrieving metadata such as the URL you’re on, the current route and its parameters, and whether or not there was an error
<! file: +layout.svelte >
<script>
import { page } from '$app/state';
</script>
<p>Currently at {page.url.pathname}</p>
{#if page.error}
<span class="red">Problem detected</span>
{:else}
<span class="small">All systems operational</span>
{/if}
Changes to page are available exclusively with runes. (The legacy reactivity syntax will not reflect any changes)
<! file: +page.svelte >
<script>
import { page } from '$app/state';
const id = $derived(page.params.id); // This will correctly update id for usage on this page
$: badId = page.params.id; // Do not use; will never update after initial load
</script>
On the server, values can only be read during rendering (in other words not in e.g. load functions). In the browser, the values can be read at any time.
page, const updated: {
readonly current: boolean;
check(): Promise<boolean>;
}
A read-only reactive value that’s initially false. If version.pollInterval is a non-zero value, SvelteKit will poll for new versions of the app and update current to true when it detects one. updated.check() will force an immediate check, regardless of polling.
updated } from '$app/state';导航
一个表示正在进行的导航的只读对象，具有 from、to、type 以及（如果 type === 'popstate'）delta 属性。当没有导航发生或服务器渲染期间，值 null。
const navigating:
| import('@sveltejs/kit').Navigation
| {
from: null;
to: null;
type: null;
willUnload: null;
delta: null;
complete: null;
};页
一个只读的响应式对象，包含有关当前页面的信息，服务于多个用例：
- 检索组件树中所有页面/布局的合并
数据（也见加载数据） - 检索组件树中任何位置的
表单属性的当前值（也参见 表单操作） - 获取通过
goto、pushState或replaceState设置的页面状态（也参见 goto 和 浅层路由） - 检索元数据，例如您所在的 URL、当前路由及其参数，以及是否发生错误
<script>
import { page } from '$app/state';
</script>
<p>Currently at {page.url.pathname}</p>
{#if page.error}
<span class="red">Problem detected</span>
{:else}
<span class="small">All systems operational</span>
{/if}<script lang="ts">
import { page } from '$app/state';
</script>
<p>Currently at {page.url.pathname}</p>
{#if page.error}
<span class="red">Problem detected</span>
{:else}
<span class="small">All systems operational</span>
{/if}变更 页面 仅可通过符文进行。 (旧的反应性语法将不会反映任何变更)
<script>
import { page } from '$app/state';
const id = $derived(page.params.id); // This will correctly update id for usage on this page
$: badId = page.params.id; // Do not use; will never update after initial load
</script><script lang="ts">
import { page } from '$app/state';
const id = $derived(page.params.id); // This will correctly update id for usage on this page
$: badId = page.params.id; // Do not use; will never update after initial load
</script>在服务器上，值只能在渲染时读取（换句话说，在例如 加载 函数中 不能 读取）。在浏览器中，值可以在任何时候读取。
const page: import('@sveltejs/kit').Page;更新
一个初始值为false的只读响应式值。如果version.pollInterval是一个非零值，SvelteKit 将轮询应用的新版本，并在检测到新版本时将current更新为true。updated.check()将强制立即检查，无论是否轮询。
const updated: {
get current(): boolean;
check(): Promise<boolean>;
};Edit this page on GitHub llms.txt