Zastępcza treść slotu
Renderuj domyślną treść wewnątrz , gdy komponent nadrzędny niczego nie dostarczy.
Zastępcza treść slotu to bezpłatna lekcja Sveltejs Academy na CoddyKit. To lekcja 3 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.
Wartość domyślna wewnątrz slotu
Zawartość umieszczona wewnątrz tagu <slot> jest wyświetlana, gdy komponent nadrzędny niczego nie dostarczy.
<button>
<slot>Click me</slot>
</button>Dobre wartości domyślne
Zapewniaj rozsądne wartości domyślne, które sprawdzają się w większości przypadków bez udziału komponentu nadrzędnego.
Wartości zastępcze nazwanych slotów
Named slots również obsługują zawartość zastępczą.
<slot name="title">Default Title</slot>Strategia dla poszczególnych slotów
Dla każdego slotu można zastosować inną strategię zawartości zastępczej. Łącz je zależnie od potrzeb.
Zastępowanie po wypełnieniu
Jeśli komponent nadrzędny dostarczy zawartość, zawartość zastępcza zostaje całkowicie zastąpiona.
Przydatne w komponentach headless
Komponenty interfejsu headless często mają minimalną zawartość zastępczą, ponieważ użytkownicy w pełni je dostosowują.
Unikaj rozbudowanej zawartości zastępczej
Wartości domyślne powinny być niewielkie. Duża zawartość zastępcza zwiększa rozmiar nieużywanych komponentów.
Ikony i etykiety
To częsty wzorzec w przypadku przycisków z ikonami: zawartość zastępcza wyświetla ogólną ikonę, jeśli nie dostarczono żadnej.
Łączenie z warunkami
Zawartość zastępcza dobrze współpracuje ze sprawdzaniem $$slots w bardziej zaawansowanych wzorcach.
Czy znaczniki są dozwolone?
Zawartość zastępcza może zawierać dowolne znaczniki, w tym inne komponenty.
Test wizualny
Zawsze wyświetlaj podgląd komponentu bez żadnej zawartości slotów, aby sprawdzić zawartość zastępczą.
Szybkie sprawdzenie
Kiedy wyświetlana jest zawartość zastępcza slotu?
Podsumowanie
Umieść domyślną zawartość między tagami <slot>, aby zapewnić zawartość zastępczą, gdy komponent nadrzędny nie przekazuje własnej.
Często zadawane pytania
Czy lekcja „Zastępcza treść slotu” jest bezpłatna?
Tak — pełny tekst „Zastępcza treść slotu” 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 „Zastępcza treść slotu”?
Renderuj domyślną treść wewnątrz , gdy komponent nadrzędny niczego nie dostarczy. Ć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 3 z 4.
Ile czasu zajmuje lekcja „Zastępcza treść slotu”?
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
- Domyślne sloty do projekcji treści
- Nazwane sloty z slot="name"
- Zastępcza treść slotu
- Sprawdzanie treści slotów za pomocą $$slots