List Rendering Svelte — Svelte

Gunakan {#each} untuk merender list di Svelte. {#each} let buah = ["Apel", "Mangga", "Jeruk"] {#each buah as item} {item} {/each} Dengan Index {#each buah as it

Gunakan {#each} untuk merender list di Svelte.

{#each}

<script>
  let buah = ["Apel", "Mangga", "Jeruk"]
</script>

<ul>
  {#each buah as item}
    <li>{item}</li>
  {/each}
</ul>

Dengan Index

{#each buah as item, i}
  <li>{i + 1}. {item}</li>
{/each}

Keyed Each

{#each users as user (user.id)}
  <UserCard name={user.name} />
{/each}

Key (user.id) membantu Svelte melacak perubahan list secara efisien.

{:else} di Each

{#each items as item}
  <p>{item}</p>
{:else}
  <p>Tidak ada item.</p>
{/each}

Yang akan kamu pelajari