How to Handle Recursion in Svelte

How to Handle Recursion in Svelte

Ferenc Almasi β€’ 2020 October 02 β€’ πŸ“– 1 min read
  • twitter
  • facebook

You can create recursive components in Svelte using a special component that calls the component it is defined in:

<script>
  export let count;
</script>

{#if count > 0}
  <span>Liftoff in {count}</span>
  <svelte:self count="{count - 1}" />
{/if}

<CountDown count="10" />
Recursion.svelte
Copied to clipboard!

Take note that you can only use svelte:self in an if statement to prevent infinite loops.

How to Handle Recursion in Svelte
If you would like to see more Webtips, follow @flowforfrank

Looking into SvelteΒ 3
Looking to improve your skills? Learn how to build reactive apps with Svelte + Tailwind.
Master Svelte

Resources:

Did you find this page helpful?
πŸ“š More Webtips
Frontend Course Dashboard
Master the Art of Frontend
  • check Unlimited access to hundred of tutorials
  • check Access to exclusive interactive lessons
  • check Remove ads to learn without distractions
Become a Pro

Recommended