Sveltejs Academy · Lesson

{#if} {#else if} {#else}

Conditionally render markup based on JavaScript expressions.

Conditional Blocks

Svelte conditionals look like Handlebars: {#if}, {:else if}, {:else}, closed with {/if}.

Show one branch or another based on a boolean expression.

{#if loggedIn}
  <p>Welcome back!</p>
{:else}
  <p>Please sign in.</p>
{/if}