Lauscher
Watcher sind in ofa.js eine Funktion, um Änderungen von Daten zu überwachen und entsprechende Logik auszuführen. Wenn sich reaktive Daten ändern, wird automatisch eine Callback-Funktion ausgelöst, die dir erlaubt, Aufgaben wie Datentransformation, Seiteneffekte oder asynchrone Verarbeitungen durchzuführen.
Grundlegende Verwendung
Listener werden im watch-Objekt der Komponente definiert, wobei der Schlüsselname dem zu beobachtenden Datenattributnamen entspricht und der Wert eine Callback-Funktion ist, die ausgeführt wird, wenn sich die Daten ändern.
count:{{count}}
doubleCount:{{doubleCount}}
Parameter der Rückruffunktion
Die Listener-Callback-Funktion empfängt zwei Parameter:- newValue：Der neue Wert nach der Änderung
{watchers}：Alle Watcher-Objekte der aktuellen Komponente
Nach einer Datenänderung wird zunächst eine Debounce-Verarbeitung durchgeführt, bevor der Callback in watch ausgeführt wird; der Parameter watchers ist die Menge aller im aktuellen Debounce-Zyklus zusammengefassten Änderungen.
Die Funktion in watch wird sofort nach Abschluss der Komponenteninitialisierung aufgerufen, um Datenüberwachungen einzurichten. Man kann feststellen, ob es sich um den ersten Aufruf handelt, indem man prüft, ob watchers eine Länge hat.
Name: {{name}}
Alter: {{age}}
{{log}}
Tiefe Beobachtung
Bei verschachtelten Daten vom Typ Objekt oder Array führt watch automatisch eine Tiefenüberwachung durch.
Benutzerinformation:
Name: {{user.name}}
Alter: {{user.age}}
Hobbys: {{user.hobbies.join(', ')}}
Mehrere Datenquellen überwachen
Sie können gleichzeitig Änderungen mehrerer Daten überwachen und in der Callback-Funktion die entsprechende Logik basierend auf den Änderungen mehrerer Daten ausführen.
Breite: {{rectWidth}}
Höhe: {{rectHeight}}
Fläche: {{area}}
Praktische Anwendungsszenarien
1. Formularvalidierung
{{usernameError}}
{{emailError}}
2. Thema einrichten
Einstellung: {{settings.theme}}
Speicherstatus: {{saveStatus}}
Hinweise
- Vermeiden Sie die Änderung von überwachten Daten: Das Ändern von überwachten Daten im Rückruf eines Watchers kann zu einer Endlosschleife führen. Falls eine Änderung erforderlich ist, stellen Sie sicher, dass eine angemessene Bedingung vorhanden ist.
- Verwenden Sie stattdessen berechnete Eigenschaften: Wenn Sie einen neuen Wert basierend auf Änderungen mehrerer Daten berechnen müssen, wird empfohlen, berechnete Eigenschaften anstelle eines Watchers zu verwenden.