javascript / intermediate
Snippet
Deklarative Promise-Verarbeitung mit Await-Blöcken
Svelte ermöglicht es, asynchrone Promises direkt im Markup zu verarbeiten. Dies erübrigt zwischengeschaltete Statusvariablen wie 'isLoading' oder 'error' in Ihrer Skriptlogik.
snippet.js
javascript
1
2
3
4
5
6
7
{#await fetchUserData()}<p>Fetching user...</p>{:then user}<p>Welcome back, {user.name}!</p>{:catch error}<p style="color: red">{error.message}</p>{/await}
svelte
Erklärung
1
{#await fetchUserData()}
Initiiert die Verfolgung einer Funktion, die ein Promise zurückgibt, direkt im Template.
2
{:then user}
Der Block, der gerendert wird, sobald das Promise erfüllt ist, und das Ergebnis als lokale Variable bereitstellt.
3
{:catch error}
Der Fehlerblock, der gerendert wird, wenn das Promise abgelehnt wird, und die Exception abfängt.