Part 1 / Logic / Else-if blocks
Multiple conditions can be 'chained' together with else if
:
App.svelte
{#if x > 10}
<p>{x} is greater than 10</p>
{:else if x < 5}
<p>{x} is less than 5</p>
{:else}
<p>{x} is between 5 and 10</p>
{/if}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script>
let x = 0;
</script>
<button on:click={() => x += 1}>+1</button>
{#if x > 10}
<p>{x} is greater than 10</p>
{:else}
{#if x < 5}
<p>{x} is less than 5</p>
{:else}
<p>{x} is between 5 and 10</p>
{/if}
{/if}
initialising