Passaggio delle props dal genitore
Fornisca valori alle props dei componenti figli nel template del genitore.
Passaggio delle props dal genitore è una lezione Sveltejs Academy gratuita su CoddyKit. Questa è la lezione 2 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.
Importare il componente figlio
Utilizzi un import ES standard all'inizio del componente padre per importare il componente figlio.
<script>
import Greeting from "./Greeting.svelte";
</script>Usare il tag
Esegua il rendering del componente figlio scrivendo un tag con il suo nome in maiuscolo.
<Greeting />Passare valori statici
Passi una stringa letterale usando attributi tra virgolette.
<Greeting name="Ada" />Passare valori dinamici
Passi un'espressione JavaScript racchiudendo il valore tra parentesi graffe.
<Greeting name={userName} />Abbreviazione con lo stesso nome
Se la prop e la variabile hanno lo stesso nome, usi l'abbreviazione {name}.
<Greeting {name} />Più props
Combini props statiche, dinamiche e in forma abbreviata in qualsiasi ordine.
<Card title="Tasks" {items} count={items.length} />Props con spread
Distribuisca un oggetto di props con la sintassi {...obj}.
<Card {...cardProps} />Props condizionali
Combini operatori ternari per fornire valori condizionali.
<Button label={isLoading ? "Saving..." : "Save"} />Abbreviazione booleana
Passi un attributo booleano senza valore per impostarlo su true.
<Toggle disabled />Funzioni come props
Può passare riferimenti a funzioni come props per i callback.
<Modal onClose={() => (open = false)} />Props oggetto
Passi oggetti interi quando molti valori correlati devono essere trasferiti insieme.
<UserCard user={currentUser} />Verifica rapida
Come si passa una variabile come prop?
Riepilogo
Importi il componente, utilizzi il tag e passi le props con valori letterali, espressioni, abbreviazioni o spread.
Impara HTML con un tutor IA — gratis
Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.
- Corsi
- 41
- Lezioni
- 163
Domande Frequenti
La lezione «Passaggio delle props dal genitore» è gratuita?
Sì — il testo completo di «Passaggio delle props dal genitore» è 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 «Passaggio delle props dal genitore»?
Fornisca valori alle props dei componenti figli nel template del genitore. 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 2 di 4.
Quanto tempo richiede la lezione «Passaggio delle props dal genitore»?
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
- Dichiarazione delle props con export let
- Passaggio delle props dal genitore
- Valori predefiniti delle props
- Inoltro delle props con $$props e $$restProps