javascript / intermediate
Snippet
Flache Reaktivität für schwere Daten
Die Funktion shallowReactive erstellt einen reaktiven Proxy, der nur Änderungen auf der obersten Ebene verfolgt. Verschachtelte Objekte werden nicht in Proxies konvertiert. Dies bietet einen erheblichen Leistungsschub bei großen, komplexen Datenstrukturen, bei denen nur auf Änderungen der obersten Ebene reagiert werden muss.
snippet.js
1
2
3
4
5
6
7
8
9
import { shallowReactive } from 'vue';const state = shallowReactive({user: 'Sam',metadata: { lastLogin: '2023-01-01' }});// state.user is reactive// state.metadata properties are NOT reactive
vue
Erklärung
1
shallowReactive({ ... })
Erstellt ein reaktives Objekt, das ein tiefes Durchlaufen seiner Eigenschaften vermeidet.
2
user: 'Sam'
Änderungen an dieser Root-Eigenschaft lösen ein erneutes Rendern der Komponente aus.
3
metadata: { ... }
Das Objekt selbst ist reaktiv, aber Änderungen innerhalb seiner Felder (z. B. lastLogin) werden von Vue ignoriert.