{#await} memungkinkan kamu menangani Promise langsung di template.

Sintaks Lengkap

<script>
  let promise = fetch("/api/data").then(r => r.json())
</script>

{#await promise}
  <p>Loading...</p>
{:then data}
  <p>Data: {data.nama}</p>
{:catch error}
  <p>Error: {error.message}</p>
{/await}

Tanpa Loading State

{#await promise then data}
  <p>{data.nama}</p>
{/await}

Dengan Refresh

<script>
  let promise = getData()

  function refresh() {
    promise = getData() // trigger ulang await block
  }
</script>

<button on:click={refresh}>Refresh</button>

{#await promise}
  <p>Loading...</p>
{:then data}
  <pre>{JSON.stringify(data, null, 2)}</pre>
{/await}