1 00:00:02,220 --> 00:00:07,770 Lo stato è un concetto cruciale e reagisce, ed è quindi importante per me capire come 2 00:00:07,770 --> 00:00:08,160 funziona. 3 00:00:08,670 --> 00:00:14,340 U. S. state è il modo in cui gestisci i componenti statali e funzionali e il tuo stato può essere qualsiasi cosa. 4 00:00:14,350 --> 00:00:15,510 Non deve essere un array. 5 00:00:15,570 --> 00:00:20,580 Potrebbe essere un testo, un numero, un oggetto, una matrice, un valore booleano, qualcosa del genere. 6 00:00:21,570 --> 00:00:24,780 Usa stato restituisce sempre un array con due elementi. 7 00:00:24,870 --> 00:00:30,450 Indipendentemente dal tuo stato, se il tuo stato è uno stato di non utilizzo restituisce comunque un array con esattamente due 8 00:00:30,450 --> 00:00:30,930 elementi. 9 00:00:31,380 --> 00:00:35,760 Perché il primo elemento è quindi sempre la tua ultima istantanea di stato. 10 00:00:36,210 --> 00:00:43,020 E il secondo elemento è una funzione che consente di aggiornare lo snapshot di stato ogni volta che si aggiorna lo 11 00:00:43,080 --> 00:00:44,350 snapshot di stato. 12 00:00:44,520 --> 00:00:46,020 React farà due cose. 13 00:00:46,620 --> 00:00:49,950 Aggiornerà questi dati di stato memorizzati internamente. 14 00:00:50,250 --> 00:00:56,130 Quindi, per esempio, qui, quando aggiungiamo il nostro primo nuovo obiettivo, sostituirà lo stato iniziale con il nostro 15 00:00:56,130 --> 00:00:57,090 nuovo stato. 16 00:00:57,210 --> 00:01:00,150 In questo caso, con il nuovissimo array che abbiamo creato con Concat. 17 00:01:00,870 --> 00:01:07,500 E una volta che ha aggiornato i dati internamente, chiamerà di nuovo questa funzione componente ed eseguirà 18 00:01:07,500 --> 00:01:08,640 l'intera funzione. 19 00:01:08,850 --> 00:01:11,250 E quindi tutti i re hanno reso questo J come codice X. 20 00:01:12,020 --> 00:01:14,400 Ora sotto il cofano, non restituirà l'intera dom. 21 00:01:14,400 --> 00:01:20,250 Controllerà solo quali parti del DOM devono essere aggiornate, ma rivaluterà l'intero componente. 22 00:01:20,920 --> 00:01:27,030 Ciò significa, ovviamente, che esegue nuovamente use state ma use state internamente funziona in modo tale da inizializzare uno 23 00:01:27,030 --> 00:01:32,400 stato stazionario solo quando il componente viene renderizzato per la prima volta e per un successivo 24 00:01:32,400 --> 00:01:33,420 Rehren ricicla. 25 00:01:33,690 --> 00:01:39,630 Estrae semplicemente l'istantanea dell'ultimo stato e praticamente ignora il valore iniziale impostato qui. 26 00:01:41,580 --> 00:01:43,770 Ecco come funziona uno stato. 27 00:01:44,370 --> 00:01:49,140 Ora, è importante capire che questo modo di aggiornare la nostra proprietà in questo scenario non è 28 00:01:49,140 --> 00:01:50,310 il modo migliore possibile. 29 00:01:50,670 --> 00:01:52,980 Così duplicato e commentato. 30 00:01:53,160 --> 00:01:54,900 Quindi ce l'abbiamo ancora come riferimento. 31 00:01:54,930 --> 00:01:56,880 Ma vediamo anche l'approccio migliore. 32 00:01:57,390 --> 00:01:58,830 Questo approccio funziona chiaramente. 33 00:01:58,950 --> 00:02:00,600 E nella maggior parte dei casi funzionerà. 34 00:02:01,170 --> 00:02:06,750 Ma devi essere consapevole del fatto che questo intero stato di aggiornamento fa parte del processo di reazione. 35 00:02:07,230 --> 00:02:08,880 La fine non è gestita da reagire. 36 00:02:09,330 --> 00:02:15,180 E quando assegni e dichiari che non mette in pausa tutto e reinserisci immediatamente la tua app. 37 00:02:15,510 --> 00:02:17,910 Al contrario, è pianificato l'aggiornamento dello stato. 38 00:02:18,150 --> 00:02:23,550 E se hai un'applicazione con molti aggiornamenti di stato in corso e molto lavoro in corso, il 39 00:02:23,820 --> 00:02:29,280 che non è il caso e fa l'applicazione ma può essere il caso e altre applicazioni, l'aggiornamento del 40 00:02:29,340 --> 00:02:32,010 tuo stato potrebbe essere differito di alcuni millisecondi. 41 00:02:32,580 --> 00:02:39,780 Ciò significa che forse se un utente fa clic, aggiunge oro più volte, lo Skold di base, che è attualmente visualizzato sullo 42 00:02:39,780 --> 00:02:45,900 schermo, potrebbe non essere il nostro stato più recente perché non tutti gli aggiornamenti di stato potrebbero essere 43 00:02:45,900 --> 00:02:46,950 ancora stati elaborati. 44 00:02:47,640 --> 00:02:53,670 Pertanto, esiste una forma migliore di aggiornamento di questo invece di passare i nostri nuovi dati di stato per stabilire gli obiettivi del 45 00:02:53,670 --> 00:02:53,970 corso. 46 00:02:54,360 --> 00:03:01,710 È possibile passare una funzione per impostare gli obiettivi del corso, una funzione che riceve gli ultimi obiettivi del corso pref dello stato 47 00:03:01,800 --> 00:03:05,670 e deve restituire una nuova istantanea dello stato e reagire bene. 48 00:03:05,670 --> 00:03:11,070 Pianifica quindi tutte queste chiamate di funzione e garantisci che vengano eseguite nell'ordine giusto in 49 00:03:11,070 --> 00:03:17,160 modo che anche se un aggiornamento di stato è stato rinviato al momento dell'esecuzione dell'aggiornamento successivo, ti garantisca 50 00:03:17,160 --> 00:03:18,900 anche il primo eseguito. 51 00:03:19,470 --> 00:03:25,080 E poi qui darteresti semplicemente Darfor per il ritorno all'oro, che non è ancora un nuovo 52 00:03:25,080 --> 00:03:25,440 obiettivo. 53 00:03:25,890 --> 00:03:28,680 Produrrà lo stesso risultato di prima in questa app. 54 00:03:28,920 --> 00:03:31,850 E in questa semplice app, questo approccio sarebbe andato bene. 55 00:03:31,890 --> 00:03:39,270 Fondamentalmente non c'è alcuna possibilità di reagire, rinviando gli aggiornamenti così a lungo da finire con uno stato errato. 56 00:03:39,720 --> 00:03:43,050 Ma questo è l'approccio a prova di proiettile che funzionerà sempre. 57 00:03:43,410 --> 00:03:49,680 Ne hai bisogno solo se l'aggiornamento dello stato dipende dai dati dello stato precedente, come si fa. 58 00:03:50,010 --> 00:03:55,860 Se l'aggiornamento dello stato è un nuovo pezzo di dati, che non dipende dallo stato precedente, è sempre possibile utilizzare 59 00:03:55,920 --> 00:03:58,380 in modo sicuro questo modulo non funzionale. 60 00:03:59,160 --> 00:04:03,150 Ed ecco una nota a margine, perché, naturalmente, tutto l'accorciamento sfrutta la sintassi 61 00:04:03,150 --> 00:04:06,780 della funzione erale e si libera dell'istruzione return in parentesi graffe. 62 00:04:07,050 --> 00:04:10,110 Dal momento che abbiamo una sola espressione che restituiamo immediatamente. 63 00:04:10,710 --> 00:04:15,690 Quindi ora con quell'annuncio, Brooks ha chiesto prima, ma questo è un approccio un po 'più sicuro e ha raccomandato un 64 00:04:15,690 --> 00:04:16,080 approccio. 65 00:04:16,110 --> 00:04:18,690 Se l'aggiornamento dello stato dipende dallo stato precedente.