Sveltejs Academy · Lektion

Delte data på tværs af layouts

Indlæs data i et overordnet layout, og tilgå dem i underordnede sider og layouts

Lektion 4 af 413 trin

Delte data på tværs af layouts er en gratis Sveltejs Academy-lektion på CoddyKit. Dette er lektion 4 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.

Layoutindlæsninger

Et +layout.js eller +layout.server.js kan indlæse data, som deles af alle sider under det.

Adgang til data

Siden modtager data, der er flettet sammen fra alle overordnede layouts og selve siden.

export let data;
// data has both layout and page properties

Nedarvning i komponenter

Brug $page.data til at få adgang til de flettede data overalt i layouttræet.

import { page } from "$app/stores";
<p>User: {$page.data.user?.name}</p>

Godkendelse på topniveau

Indlæs den aktuelle bruger i rodlayoutet. Alle sider kan få adgang til brugeren via $page.data.

Undgå duplikering

Ved at indlæse data i det højest placerede layout, der har brug for dem, undgår du gentagne hentninger på hver side.

Data kun på serveren

Ved følsomme data skal du indlæse dem i +layout.server.js, så de aldrig når klienten, medmindre de gengives.

Streaming

Layoutindlæsninger kan streame Promises ligesom sideindlæsninger.

Konfliktløsning

Sidedata overskriver layoutdata med den samme nøgle.

TypeScript-nedarvning

Sidedatatyper omfatter automatisk data fra overordnede layouts via genererede typer.

Ugyldiggørelse

Brug invalidate til at køre bestemte layoutindlæsninger igen efter behov.

import { invalidate } from "$app/navigation";
invalidate("app:user");

Hierarki

Betragt layouts som et datahierarki: rod til globale data, sektioner til sektionsspecifikke data og sider til sidespecifikke data.

Hurtigt tjek

Hvordan får du adgang til layoutdata på en side?

Besvar den i den interaktive lektion

Opsummering

Layoutindlæsninger bidrager til et flettet dataobjekt, som efterkommere kan tilgå via data-proppen og $page.data.

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

Start gratis Se hele kurset

Ofte stillede spørgsmål

Er lektionen “Delte data på tværs af layouts” gratis?

Ja — hele teksten til “Delte data på tværs af layouts” 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 “Delte data på tværs af layouts”?

Indlæs data i et overordnet layout, og tilgå dem i underordnede sider og layouts 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 4 af 4.

Hvor lang tid tager lektionen “Delte data på tværs af layouts”?

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

← Tilbage til Sveltejs Academy