Svelte • Legacy APIs

<svelte:self>

The <svelte:self> element allows a component to include itself, recursively.

It cannot appear at the top level of your markup; it must be inside an if or each block or passed to a component’s slot to prevent an infinite loop.

<script lang="ts">
	export let let count: anycount;
</script>

{#if let count: anycount > 0}
	<p>counting down... {let count: anycount}</p>
	<svelte:self count={let count: anycount - 1} />
{:else}
	<p>lift-off!</p>
{/if}
<script>
	export let let count: anycount;
</script>

{#if let count: anycount > 0}
	<p>counting down... {let count: anycount}</p>
	<svelte:self count={let count: anycount - 1} />
{:else}
	<p>lift-off!</p>
{/if}

This concept is obsolete, as components can import themselves:

<script lang="ts">
	import 
type Self = SvelteComponent<Record<string, any>, any, any>
const Self: LegacyComponentType
Self
from './App.svelte'
export let let count: anycount; </script> {#if let count: anycount > 0} <p>counting down... {let count: anycount}</p> <const Self: LegacyComponentTypeSelf count={let count: anycount - 1} /> {:else} <p>lift-off!</p> {/if}
<script>
	import 
type Self = SvelteComponent<Record<string, any>, any, any>
const Self: LegacyComponentType
Self
from './App.svelte'
export let let count: anycount; </script> {#if let count: anycount > 0} <p>counting down... {let count: anycount}</p> <const Self: LegacyComponentTypeSelf count={let count: anycount - 1} /> {:else} <p>lift-off!</p> {/if}