Hva er Suspense-komponenten i Vue?

Question

Accepted Answer

`` er en innebygd komponent som koordinerer **asynkrone avhengigheter** i komponenttreet sitt — den viser en fallback (lasting-UI) til alle nestede asynkrone operasjoner løses, deretter vises det faktiske innholdet. Den fjerner manuell `isLoading` boilerplate. ## De to sporene ```vue ``` ## Det fungerer med async setup() / top-level await ```vue ``` Normalt kan en komponent ikke `await` i setup uten å administrere lastetilstand. `` lar et barn bruke **top-level `await`** (eller async `setup`), og forelder Suspense håndterer lastetilstanden for det — barnkoden forblir ren, bare `await` sine data. ## Den venter på ALLE nestede asynkrone avhengigheter ```text waits for every async setup in its subtree to resolve, then swaps the fallback for the real content in one go (avoids a cascade of separate spinners). ``` ## Håndtering av feil ```vue ``` Parr Suspense med en feilgrense (`onErrorCaptured`) for å håndtere mislykkede asynkrone oppsett, siden Suspense selv bare administrerer last-/lastet-overgangen. ## Statusnotat ```text has been an EXPERIMENTAL feature — its API may change. It's also what Nuxt uses internally to coordinate async page data. ``` ## Hvorfor det er viktig `` koordinerer deklarativt asynkrone lastetilstander — komponenter kan `await` dataene sine direkte mens en enkelt forfar viser en fallback til alt er klart. Det eliminerer spredte `isLoading` flagg og flere spinnere, og understøtter datahenting i rammeverk som Nuxt. Å vite at det finnes (og at det fortsatt er eksperimentelt, best kombinert med en feilgrense) er nyttig for ren asynkron brukergrensesnitt, spesielt i SSR/datakrevende apper.