在 Svelte 模板中解析 Promises
學習如何在 Svelte 模板中處理 Promises Promises 是一種在 JavaScript 中處理異步事件的強大工具。 ES2017 中相對較新引入的 await 語法使得使用 Promises 更加簡單。 Svelte 在模板中提供了 {#await} 語法，以直接處理模板層級的 Promises。 我們可以等待 Promises 解析，並為 Promise 的各種狀態（未解析、已解析和被拒絕）定義不同的 UI。 這是它的工作原理。我們定義一個 Promise，然後使用 {#await} 區塊等待其解析。 一旦 Promise 解析完成，結果將傳遞給 {:then} 區塊： <script> const fetchImage = (async () => { const response = await fetch('https://dog.ceo/api/breeds/image/random') return await response.json() })() </script> {#await fetchImage} <p>...等待中</p> {:then data} <img src={data.message} alt="狗圖片" /> {/await} 您可以通過添加 {:catch} 區塊來檢測 Promise 的拒絕： {#await fetchImage} <p>...等待中</p> {:then data} <img src={data....