javascript / intermediate
Snippet
Tiefgehende Überwachung reaktiver Objekte
Bei der Überwachung verschachtelter Objekte benötigen Sie die Option 'deep', um Änderungen innerhalb der Objektstruktur zu verfolgen. 'immediate' löst den Callback sofort nach der Initialisierung aus.
snippet.js
1
2
3
4
5
6
7
8
9
10
11
import { watch, reactive } from 'vue';const state = reactive({ user: { settings: { theme: 'dark' } } });watch(() => state.user,(newVal) => {console.log('User settings changed!', newVal);},{ deep: true, immediate: true });
vue
Erklärung
1
() => state.user
Eine Getter-Funktion, die dem Watcher sagt, welcher Teil des Status beobachtet werden soll.
2
{ deep: true }
Aktiviert die rekursive Überwachung aller verschachtelten Eigenschaften.
3
immediate: true
Führt den Watcher-Callback sofort mit dem aktuellen Wert aus.