Mam kilka pól wyboru, które po kliknięciu powodują wiele zmian w DOM, i to zawiesza się aplikacja na kilka sekund. Chciałbym, aby pola najpierw zostały odnowione i/lub zawierały wskaźnik gotowości. Próbowałem różnych rzeczy, ale z jakiegoś powodu nic więcej w DOM nie będzie aktualizowany do zamrażania. Zmian dokonuje się w wielką tabelę, albo usuwając lub dodając całe kolumny, i to działa tak, jakby to ma wyższy priorytet w porównaniu z czymkolwiek innym, bo wszelkie inne próby zaktualizować DOM po kliknięciu pola wyboru nie są wykonywane do momentu, gdy tabela nie zakończy ponowne wizualizację. FU, mogę korzystać z konsoli.zaloguj się, aby wyświetlić komunikat do aktualizacji tabeli, a także po jej zakończeniu, z jakiegokolwiek powodu.
0
import {tick} from "svelte";
let checked = false;
$: applyChanges(checked);
async function applyChanges() {
messageVisible = true
await tick()
requestAnimationFrame(() => {
requestAnimationFrame(() => {
// do the stuff that causes a lots of dom updates
})
})
}
To await tick() stosuje messageVisible zmiany w DOM.
Podwójny raf będzie czekać, aż przeglądarka zwraca odnowiony DOM.