Contenuto alternativo degli slot
Esegua il rendering del contenuto predefinito all'interno di un quando il genitore non fornisce nulla.
Contenuto alternativo degli slot è una lezione Sveltejs Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Sveltejs Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Sveltejs Academy include 4 lezioni in totale.
Contenuto predefinito nello slot
Il contenuto inserito nel tag <slot> viene mostrato quando il componente padre non fornisce nulla.
<button>
<slot>Click me</slot>
</button>Scegliere buoni valori predefiniti
Fornisca valori predefiniti sensati, adatti alla maggior parte dei casi senza intervento del componente padre.
Fallback degli slot denominati
Anche gli slot denominati supportano il contenuto di fallback.
<slot name="title">Default Title</slot>Strategia per slot
Può adottare strategie di fallback diverse per ogni slot. Le combini secondo necessità.
Sostituito quando viene riempito
Se il componente padre fornisce contenuto, il fallback viene sostituito completamente.
Utile per i componenti headless
I componenti UI headless hanno spesso fallback minimi; chi li utilizza può personalizzarli completamente.
Eviti fallback pesanti
Mantenga ridotti i valori predefiniti. Fallback di grandi dimensioni appesantiscono i componenti inutilizzati.
Icone ed etichette
È comune nei pulsanti con icona: il fallback mostra un'icona generica se non ne viene fornita alcuna.
Combinare con le condizioni
I fallback si combinano bene con i controlli $$slots per implementare schemi avanzati.
Il markup non è consentito?
Il fallback può includere qualsiasi markup, compresi altri componenti.
Test visivo
Visualizzi sempre l'anteprima del componente senza contenuto negli slot per verificare il fallback.
Verifica rapida
Quando viene mostrato il fallback di uno slot?
Riepilogo
Inserisca il contenuto predefinito tra i tag <slot> per fornire un fallback quando il componente padre omette il contenuto.
Domande Frequenti
La lezione «Contenuto alternativo degli slot» è gratuita?
Sì — il testo completo di «Contenuto alternativo degli slot» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Sveltejs Academy, passa a CoddyKit PRO. Il corso Sveltejs Academy include 4 lezioni in totale.
Cosa imparerò in «Contenuto alternativo degli slot»?
Esegua il rendering del contenuto predefinito all'interno di un quando il genitore non fornisce nulla. Eserciti Sveltejs Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Sveltejs Academy?
Non è richiesta alcuna esperienza precedente. Sveltejs Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.
Quanto tempo richiede la lezione «Contenuto alternativo degli slot»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Sveltejs Academy?
Sì. Ogni lezione Sveltejs Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Slot predefiniti per la proiezione dei contenuti
- Slot denominati con slot="name"
- Contenuto alternativo degli slot
- Verifica del contenuto degli slot con $$slots