svelte : change variable value inside html block

Question

<script>
    let count=0;
</script>

{#each list as item, i}
    <div class="item">
        <Item  />
    </div>
{/each}

How do I increment the count on some condition inside each block in svelte?

Answer 1

You could use a {@const ...} inside the block like so

<script>
    let count=0;
</script>

{#each list as item, i}
    {#if somecondition}
       {@const count=++count}

    <!-- and use it after maybe as Item prop -->
    <div class="item">
        <Item {count} />
    </div>
    {#else}
     <div class="item">
        <Item {count} />
    </div>
   {/if}
{/each}