TODO ストアのエクササイズへのリンク

先に学んだように、Svelteストアは、個々のコンポーネントに属さないデータを格納する場所です。

SvelteKitは、`$app/stores`モジュールを介して、`page`、`navigating`、`updated`の3つの読み取り専用ストアを提供します。最も頻繁に使用するものは`page`であり、現在のページに関する情報を提供します。

• `url` — 現在のページのURL
• `params` — 現在のページのパラメータ
• `route` — 現在のルートを表す`id`プロパティを持つオブジェクト
• `status` — 現在のページのHTTPステータスコード
• `error` — 現在のページのエラーオブジェクト（もしあれば）（エラー処理については後ほどのエクササイズで詳しく説明します）
• `data` — すべての`load`関数の戻り値を組み合わせた、現在のページのデータ
• `form` — フォームアクションから返されたデータ

他のストアと同様に、`$`記号を名前の前に付けることで、コンポーネント内でその値を参照できます。たとえば、現在のパス名は`$page.url.pathname`としてアクセスできます。

<script>
	import { page } from '$app/stores';

	let { children } = $props();
</script>

<nav>
	<a href="/" aria-current={$page.url.pathname === '/'}>
		home
	</a>

	<a href="/about" aria-current={$page.url.pathname === '/about'}>
		about
	</a>
</nav>

{@render children()}