$effect: Seiteneffekte
Führen Sie Seiteneffekte aus, die bei jeder Änderung ihrer reaktiven Abhängigkeiten erneut ausgeführt werden.
$effect: Seiteneffekte ist eine kostenlose Sveltejs Academy-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Sveltejs Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Sveltejs Academy-Kurs umfasst insgesamt 4 Lektionen.
Rune für Seiteneffekte
Verwenden Sie $effect(() => { ... }) für Seiteneffekte, die auf reaktive Änderungen reagieren.
$effect(() => {
console.log("count is", count);
});Automatische Nachverfolgung
Svelte verfolgt die Abhängigkeiten innerhalb des Callbacks automatisch.
Bereinigungsfunktion
Geben Sie eine Funktion zurück, die vor dem nächsten Durchlauf oder bei der Zerstörung aufräumt.
$effect(() => {
const id = setInterval(tick, 1000);
return () => clearInterval(id);
});Läuft nach dem Mounten
Der Effekt läuft nach dem Mounten der Komponente und bei jeder Änderung einer Abhängigkeit.
Kein SSR
$effect-Callbacks werden während des SSR nicht ausgeführt. Verwenden Sie sie für browser-only Logik.
Effekte vor dem Mounten
$effect.pre läuft vor DOM-Aktualisierungen und eignet sich für Muster zum Messen und Anwenden.
Root-Effekte
$effect.root erstellt für fortgeschrittene Anwendungsfälle einen Effekt außerhalb des Lebenszyklus der Komponente.
Vergleich mit onMount
onMount läuft einmal; $effect wird bei Änderungen von Abhängigkeiten erneut ausgeführt. $effect ersetzt häufig sowohl onMount als auch reaktive Muster.
Zustand nicht setzen
Das Verändern reaktiven Zustands innerhalb eines Effekts kann Schleifen verursachen. Verwenden Sie für berechnete Werte bevorzugt $derived.
Nicht erfasste Lesezugriffe
Verwenden Sie untrack() innerhalb eines Effekts, um einen Wert zu lesen, ohne eine Abhängigkeit zu registrieren.
Praktische Anwendungsfälle
Logging, Synchronisierung mit localStorage, Integration von Drittanbieterbibliotheken, manuelle DOM-Anpassungen.
Kurztest
Wie bereinigen Sie einen Effekt?
Zusammenfassung
$effect verarbeitet Seiteneffekte, verfolgt Abhängigkeiten und unterstützt die Bereinigung über zurückgegebene Funktionen.
Lerne HTML mit einem KI-Tutor — kostenlos
Schreibe und führe echten Code in deinem Browser aus, bekomme sofortige Hilfe von einem 24/7 KI-Tutor und setze dein Lernen im Web oder in der App fort.
- Kurse
- 41
- Lektionen
- 163
Häufig gestellte Fragen
Ist die Lektion „$effect: Seiteneffekte“ kostenlos?
Ja — der vollständige Text von „$effect: Seiteneffekte“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Sveltejs Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Sveltejs Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „$effect: Seiteneffekte“?
Führen Sie Seiteneffekte aus, die bei jeder Änderung ihrer reaktiven Abhängigkeiten erneut ausgeführt werden. Du übst Sveltejs Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Sveltejs Academy zu starten?
Keine Vorkenntnisse erforderlich. Sveltejs Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.
Wie lange dauert die Lektion „$effect: Seiteneffekte“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Sveltejs Academy-Lektion Code schreiben und ausführen?
Ja. Jede Sveltejs Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Warum Runes: Über die Compiler-Magie hinaus
- $state: Feingranulare Reaktivität
- $derived: Deklarative berechnete Werte
- $effect: Seiteneffekte