Sveltejs Academy · Lektion

Direktivet use:enhance

Forbedr formularafsendelser gradvist med fetch på klientsiden uden fuld genindlæsning

Lektion 2 af 413 trin

Direktivet use:enhance er en gratis Sveltejs Academy-lektion på CoddyKit. Dette er lektion 2 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i Sveltejs Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Sveltejs Academy-kurset indeholder 4 lektioner i alt.

Progressiv forbedring

Formularer fungerer uden JS; use:enhance opgraderer dem til fetch-baserede indsendelser, der giver en hurtig brugeroplevelse.

Importér enhance

Fra $app/forms.

import { enhance } from "$app/forms";

Anvend på en formular

Brug use:-direktivet på formularelementet.

<form method="POST" use:enhance>...</form>

Ingen genindlæsning

Siden genindlæses ikke. SvelteKit sender formularen via fetch, behandler handlingen og opdaterer siden reaktivt.

Tilpasset håndtering

Send en callback til enhance for at få detaljeret kontrol over indsendelsen.

<form use:enhance={({ formData }) => {
  return ({ result }) => { /* custom handling */ };
}}>

Standardadfærd

Uden en callback omdirigerer eller opdaterer enhance dataene præcis som ved en fuld formularindsendelse.

Indlæsningsstatus

Følg indsendelsens status med en lokal variabel i callbacken for at vise indlæsningsindikatorer.

Fejlhåndtering

Fejl, som handlingen returnerer, vises i sidens form-prop.

Optimistisk brugergrænseflade

Opdatér den lokale tilstand i callbacken, før serveren svarer, så brugeren får øjeblikkelig feedback.

Flere formularer

Hver formular kan have sin egen enhance-adfærd. Der er ikke brug for global tilstand.

Hvorfor det er vigtigt

Du får HTML-formularers robusthed og en SPA's flydende brugeroplevelse i ét direktiv.

Hurtigt tjek

Hvad gør use:enhance?

Opsamling

use:enhance opgraderer indbyggede formularer til indsendelser på klientsiden. Tilpas adfærden via en callback.

Gratis at komme i gang

Lær HTML med en AI-underviser — gratis

Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.

Kurser
41
Lektioner
163

Ofte stillede spørgsmål

Er lektionen “Direktivet use:enhance” gratis?

Ja — hele teksten til “Direktivet use:enhance” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af Sveltejs Academy-kurset, skal du opgradere til CoddyKit PRO. Sveltejs Academy-kurset indeholder 4 lektioner i alt.

Hvad lærer jeg i “Direktivet use:enhance”?

Forbedr formularafsendelser gradvist med fetch på klientsiden uden fuld genindlæsning Du øver dig i Sveltejs Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.

Skal jeg have erfaring for at begynde på Sveltejs Academy?

Der kræves ingen tidligere erfaring. Sveltejs Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 2 af 4.

Hvor lang tid tager lektionen “Direktivet use:enhance”?

De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.

Kan jeg skrive og køre kode i denne Sveltejs Academy-lektion?

Ja. Alle Sveltejs Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.

Alle lektioner i dette kursus

  1. +page.server.js med actions
  2. Direktivet use:enhance
  3. Progressiv forbedring af formularer
  4. Håndtering af valideringsfejl i actions
← Tilbage til Sveltejs Academy