Współdzielone dane między układami
Ładuj dane w układzie nadrzędnym i uzyskuj do nich dostęp na stronach oraz w układach podrzędnych.
Współdzielone dane między układami to bezpłatna lekcja Sveltejs Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Sveltejs Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Sveltejs Academy zawiera 4 lekcji w sumie.
Wczytywanie danych przez układy
+layout.js lub +layout.server.js może wczytywać dane współdzielone przez wszystkie podrzędne strony.
Dostęp do danych
Strona otrzymuje dane połączone ze wszystkich układów nadrzędnych oraz z samej strony.
export let data;
// data has both layout and page propertiesDziedziczenie w komponentach
Proszę użyć $page.data, aby uzyskać dostęp do połączonych danych w dowolnym miejscu drzewa układów.
import { page } from "$app/stores";
<p>User: {$page.data.user?.name}</p>Uwierzytelnianie na najwyższym poziomie
Proszę wczytać bieżącego użytkownika w układzie głównym; każda strona może uzyskać do niego dostęp za pomocą $page.data.
Unikanie powielania
Wczytywanie danych w najwyższym układzie, który ich potrzebuje, zapobiega wielokrotnemu pobieraniu ich na każdej stronie.
Dane dostępne tylko na serwerze
Wrażliwe dane proszę wczytywać w +layout.server.js, aby nie trafiały do klienta, chyba że zostaną wyrenderowane.
Strumieniowanie
Wczytywanie danych przez układ może strumieniować obiekty Promise, tak samo jak wczytywanie danych przez stronę.
Rozstrzyganie konfliktów
Dane strony zastępują dane układu o tym samym kluczu.
Dziedziczenie w TypeScript
Typy danych strony automatycznie obejmują dane z układów nadrzędnych dzięki wygenerowanym typom.
Unieważnianie
Proszę użyć invalidate, aby na żądanie ponownie uruchomić wczytywanie danych wybranych układów.
import { invalidate } from "$app/navigation";
invalidate("app:user");Hierarchia
Proszę traktować układy jak hierarchię danych: katalog główny zawiera dane globalne, sekcje dane właściwe dla sekcji, a strony dane właściwe dla stron.
Szybkie sprawdzenie
Jak uzyskać dostęp do danych układu na stronie?
Podsumowanie
Wczytywanie danych przez układy tworzy połączony obiekt danych dostępny dla elementów podrzędnych za pośrednictwem właściwości data oraz $page.data.
Często zadawane pytania
Czy lekcja „Współdzielone dane między układami” jest bezpłatna?
Tak — pełny tekst „Współdzielone dane między układami” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Sveltejs Academy, przejdź na CoddyKit PRO. Kurs Sveltejs Academy zawiera 4 lekcji w sumie.
Co nauczysz się w „Współdzielone dane między układami”?
Ładuj dane w układzie nadrzędnym i uzyskuj do nich dostęp na stronach oraz w układach podrzędnych. Ćwiczysz Sveltejs Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Sveltejs Academy?
Nie wymagamy żadnego doświadczenia. Sveltejs Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.
Ile czasu zajmuje lekcja „Współdzielone dane między układami”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Sveltejs Academy?
Tak. Każda lekcja Sveltejs Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Grupy układów z (group)
- Układy na poziomie tras
- Wyjście poza układ za pomocą +page@route
- Współdzielone dane między układami