Compromessi, schemi con ref e valori predefiniti
Confronti input controllati e non controllati, utilizzi i ref per le letture e fornisca valori predefiniti sensati.
Compromessi, schemi con ref e valori predefiniti è una lezione React Academy gratuita su CoddyKit. Questa è la lezione 1 di 2. 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 React Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso React Academy include 2 lezioni in totale.
Controllato e non controllato
Obiettivo: Scelga lo stile di input più adatto.
- Controllato: valore nello stato; nuovo rendering a ogni modifica
- Non controllato: il DOM conserva il valore; lo legga tramite ref quando necessario
- Valori predefiniti: defaultValue, defaultChecked
Differenze a colpo d'occhio
- Controllato: ideale per la validazione in tempo reale, le maschere e la sincronizzazione di altri campi
- Non controllato: meno nuovi rendering; moduli semplici con lettura solo all'invio
- Mischi: controllato per i campi principali, non controllato per quelli facoltativi
Dimostrazione: input controllato
Un campo controllato memorizza value nello stato e si aggiorna a ogni modifica.
<div id="root"></div>
Dimostrazione: non controllato con ref
Un campo non controllato usa il valore del DOM; lo leggiamo tramite ref quando necessario.
<div id="root"></div>
Valori predefiniti e quando usare il controllo
Usi defaultValue/defaultChecked per i valori iniziali non controllati; passi al controllo quando servono regole applicate in tempo reale.
<div id="root"></div>
Suggerimenti e insidie
- Non combini value e defaultValue nello stesso input
- Utilizzi refs per leggere i valori non controllati
- Scelga un input controllato quando l'interfaccia reagisce a ogni pressione di tasto
Verifica: controllato e non controllato
Riepilogo
Riepilogo: Usi il controllo per le regole in tempo reale e lo stato derivato; preferisca il non controllato per le letture semplici effettuate solo all'invio. Utilizzi ref per leggere i valori e defaultValue per il contenuto iniziale.
Domande Frequenti
La lezione «Compromessi, schemi con ref e valori predefiniti» è gratuita?
Sì — il testo completo di «Compromessi, schemi con ref e valori predefiniti» è 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 React Academy, passa a CoddyKit PRO. Il corso React Academy include 2 lezioni in totale.
Cosa imparerò in «Compromessi, schemi con ref e valori predefiniti»?
Confronti input controllati e non controllati, utilizzi i ref per le letture e fornisca valori predefiniti sensati. Eserciti React 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 React Academy?
Non è richiesta alcuna esperienza precedente. React 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 1 di 2.
Quanto tempo richiede la lezione «Compromessi, schemi con ref e valori predefiniti»?
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 React Academy?
Sì. Ogni lezione React 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
- Compromessi, schemi con ref e valori predefiniti
- Prop getter e State Reducer (leggero)