javascript / beginner
Snippet
Abrufen von API-Daten beim Laden mit OnMount
Die Lifecycle-Funktion `onMount` wird einmalig nach dem ersten Rendern der Komponente ausgeführt und eignet sich ideal für asynchrone HTTP-Anfragen zum Laden von Daten.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script>import { onMount } from 'svelte';let users = [];onMount(async () => {const res = await fetch('https://jsonplaceholder.typicode.com/users');users = await res.json();});</script><ul>{#each users as user}<li>{user.name}</li>{/each}</ul>
svelte
Erklärung
1
onMount(async () => {
Registriert einen asynchronen Lifecycle-Callback, der nach dem Laden der Komponente ausgeführt wird.
2
const res = await fetch('https://jsonplaceholder.typicode.com/users');
Sendet eine asynchrone Netzwerkanfrage zum Abrufen von Benutzerdaten.
3
users = await res.json();
Parst die JSON-Antwort und weist sie zu, um die reaktive Liste zu aktualisieren.