メインコンテンツへスキップ

最後に、最終手段として invalidateAll() があります。これは、現在のページのすべての load 関数を、依存関係に関係なく、無差別に再実行します。

前の演習から src/routes/[...timezone]/+page.svelte を更新します

src/routes/[...timezone]/+page
<script>
	import { onMount } from 'svelte';
	import { invalidateAll } from '$app/navigation';

	let { data } = $props();

	onMount(() => {
		const interval = setInterval(() => {
			invalidateAll();
		}, 1000);

		return () => {
			clearInterval(interval);
		};
	});
</script>

src/routes/+layout.js 内の depends 呼び出しは不要になりました

src/routes/+layout
export async function load({ depends }) {
	depends('data:now');

	return {
		now: Date.now()
	};
}

invalidate(() => true)invalidateAll同じではありませ んinvalidateAll は、url 依存関係のない load 関数も再実行しますが、 invalidate(() => true) は実行しません。

GitHub でこのページを編集する

1