javascript / intermediate
Snippet
Handhabung von DOM-Updates mit der tick-Funktion
Die 'tick'-Funktion gibt ein Promise zurück, das aufgelöst wird, sobald alle ausstehenden Zustandsänderungen auf das DOM angewendet wurden. Dies ist wichtig, wenn Sie unmittelbar nach einer Zustandsänderung mit dem DOM interagieren müssen.
snippet.js
1
2
3
4
5
6
7
8
9
10
11
import { tick } from 'svelte';let message = 'Original';async function updateMessage() {message = 'Updated Content';// Svelte hasn't updated the DOM yetawait tick();// Now the DOM is guaranteed to be in syncconsole.log('DOM is updated');}
svelte
Erklärung
1
message = 'Updated Content';
Ändert den Status; Svelte plant ein DOM-Update, führt es aber nicht sofort aus.
2
await tick();
Wartet darauf, dass die Microtask-Queue geleert und das DOM aktualisiert wird.