Lo stato è un concetto cruciale nella reazione.
E con la nostra conoscenza dello stato, ora possiamo anche assicurarci di non creare solo un obiettivo fittizio,
ma in realtà rispecchiamo il reale input dell'utente.
Quindi, torniamo al nuovo obiettivo.
Quello che vuoi fare è che vogliamo memorizzare l'input dell'utente in una variabile su ogni sequenza di tasti in modo da avere l'ultimo
valore inserito dall'utente e quindi passare quel valore immesso ai puntelli sull'obiettivo dell'annuncio o al nostro nuovo obiettivo qui invece
di quel testo fittizio codificato che abbiamo al momento.
Quindi eccoti.
Voglio catturare l'input dell'utente qui e inviarlo al posto del mio difficile andare al testo qui come parte del nuovo
obiettivo.
Quindi potremmo creare qui una variabile, input dell'utente o testo inserito, che inizialmente è una stringa vuota.
E qui in input, sono effettivamente impostati sull'evento change.
Possiamo ascoltare quale viene attivato e ogni volta che si preme un tasto.
Quindi ora possiamo aggiungere una funzione.
Gestore di modifica del testo.
Lì otterremo un oggetto evento e quell'oggetto evento conterrà l'input dell'utente sull'evento.
Target, che si riferisce all'elemento di input, al valore punto e quindi potremmo impostare un testo uguale a
quello.
Ora, inserisci il testo cambierà ad ogni pressione di un tasto.
Una volta che ci impegniamo a modificare il gestore di modifica del testo in questo modo.
Ora, qui in un nuovo obiettivo, possiamo usare inserire il testo.
E allora, l'utente è entrato qui?
E in seguito, blocciamo tutta la console e andiamo qui in modo che possiamo vedere che funziona,
se ora siamo sicuri e inserisco il test qui e clicco all'obiettivo.
Vediamo che funziona e questo è prodotto qui.
Questo approccio generalmente va bene, ma può avere un piccolo difetto.
Cosa succede se vogliamo reimpostarlo dopo aver aggiunto un nuovo obiettivo?
Certo, possiamo andare dal nostro.
Gestore di annunci d'oro.
E una volta creato il nuovo obiettivo, possiamo, ovviamente, riportare il testo su una stringa vuota.
Ma ovviamente questo non farà nulla.
Se ho inserito il suo obiettivo, vedi, questo non si riflette qui.
Perché non si riflette?
Perché il nuovo componente Gold non è stato visualizzato.
Questo non è lo stato che stiamo gestendo.
Questa è una variabile regolare.
Quindi, ovviamente, possiamo cambiarlo.
Naturalmente possiamo usare per cambiare il valore.
Ma se poi impostiamo un nuovo valore su di esso.
Ciò non si riflette sul nostro input perché questo input ha solo una connessione al gestore di modifica del testo.
Non sa che dovrebbe riflettere il valore corrente memorizzato e inserito nel testo.
Ora potremmo dire al componente di input che dovrebbe farlo legando il suo valore prop.
Possiamo associarlo al testo inserito e con papà diciamo al componente di input.
Ehi, il valore visualizzato nell'input dovrebbe essere svalutato, memorizzato ed inserito.
Testo.
Se lo facciamo, sapremo qualcosa di nuovo.
Ora, non possiamo più digitare lì, se scrivo qui, l'input non viene riflesso.
Ora, se ci pensate, ha senso.
Quando stai dicendo alla reattanza che l'input dovrebbe essere reso in modo tale che il valore sia da inserire, da inserire nel
testo con ogni sequenza di tasti che cambiamo, inserisci il testo, ma inserire il testo non è stato.
È una variabile regolare.
Ciò significa che cambiamo la variabile con ogni pressione del tasto ma reagiamo mille riscrivendo il componente di
input.
Non riflette il valore aggiornato per reagire, svalutando sempre come una stringa vuota perché è stata l'ultima volta che
ha reso questo componente e il codice X di scarico di Delford e quindi come input.
Quindi dobbiamo dire a reagire che questo è un certo stato e che quando cambia, dovrebbe rendere nuovamente il nostro J
come codice X.
Quindi, ancora una volta, possiamo importarti come stato qui e convertire invio in uso del testo già strutturato qui e tu dichiari che
inizialmente è una stringa vuota o che inizialmente ha una stringa vuota perché sto gestendo il mio
testo inserito.
E il secondo elemento è una funzione per aggiornare lo stato che chiamerà quindi il testo impostato.
E ora qui ad ogni sequenza di tasti, ho impostato il mio testo inserito per svalutare il valore target di un evento.
E qui non abbiamo bisogno di quella forma di funzione per aggiornare lo stato perché abbiamo un valore nuovo di
zecca che non dipende dallo stato precedente.
Quindi possiamo semplicemente aggiornare per impostare in questo modo.
E ora questo lo farà.
Ritorna questo componente ogni volta che digitiamo, ogni volta che chiamiamo set, entra fermo su ogni sequenza di tasti, che suona
orribile ma che è grandioso.
Reagire.
Lo faremo in modo molto efficiente e pertanto questo ultimo valore si rifletterà sull'elemento di input.
E qui in ADCO Handler, se vogliamo aggiornare, inserire, inviare testo e ripristinarlo, possiamo sicuramente richiamare, impostare, inserire testo e
riportarlo su una stringa vuota.
E con ciò ora abbiamo il meglio di entrambi i mondi.
Possiamo inserire qualcosa qui che tutto funzioni.
Ma possiamo anche manipolarlo e ripristinarlo dopo aver aggiunto un nuovo obiettivo come questo.
Quindi questo è ora e non usare mai il caso per la gestione dello stato.
E naturalmente ci sono molti casi d'uso nella nostra applicazione REACT.
E qui stiamo usando la gestione dello stato per creare qualcosa che a volte viene anche chiamato in modo vincolante
in cui vincolare il valore dell'input e ad ogni sequenza di tasti che stiamo aggiornando al
valore, che poi ricolleghiamo all'input in modo da riflettere sempre il ultimo valore all'interno dell'input.
Ma siamo anche in grado di gestirlo in modo guidato dallo stato.
Quindi abbiamo tutti la possibilità di manipolare il valore dall'interno del nostro codice qui e di rifletterlo nell'input
in questo caso?
Con ciò, abbiamo un altro scenario di gestione statale e ora siamo in grado di aggiungere i nostri obiettivi.