大多數 Web 應用程式在某個時候都必須處理非同步資料。Svelte 讓你可以輕鬆地在你的標記中直接 await Promise 的值
應用程式
{#await promise}
<p>...rolling</p>
{:then number}
<p>you rolled a {number}!</p>
{:catch error}
<p style="color: red">{error.message}</p>
{/await}只會考慮最新的
promise，這表示你不需要擔心競爭條件。
如果你知道你的 Promise 不會 reject，你可以省略 catch 區塊。如果你不希望在 Promise resolve 之前顯示任何內容，也可以省略第一個區塊
{#await promise then number}
<p>you rolled a {number}!</p>
{/await}上一頁 下一頁
1
2
3
4
5
6
7
8
9
10
11
12
<script>
import { roll } from './utils.js';let promise = $state(roll());
</script>
<button onclick={() => promise = roll()}>roll the dice
</button>
<p>...rolling</p>