Recupera le pratiche API -2
Il metodo di comunicazione più diffuso e conosciuto tra il browser e il server è Http/s. È un protocollo costruito sulla base di Richiesta/Risposta. Oggi ci eserciteremo sull'API Fetch, uno dei tipi di API Web che forniscono questa comunicazione.
Prima di questo articolo, ti consiglio di leggere Fetch API Practices — 1 articolo. Il nostro scenario questa volta è il seguente...
Per antirimbalzo (0.5s) quando scriviamo il nome utente nel campo di testo sottostante . In altre parole, ogni volta che premiamo il tasto della tastiera, vogliamo che cerchi nel server e visualizzi il risultato di questa ricerca sullo schermo dopo aver atteso almeno 0,5 secondi, senza cercare.
Un'altra aspettativa è che lo schermo sia Stato.
const UISTATE = {
initial: 'inital (ilk başlangıç)
fetching: 'fetching', (veri çekiliyor)
fetched: 'fetched', (veri başarılı bir şekilde çekildi)
error: 'error', (veri çekilmesinde problem yaşandı)
}
//Toolu indir
npm install -g json-server //JSon Server ilgili port kendi db.json ile calistir.
JsonServer Calıstırın.
json-server --watch db.json --port 3004
La parte seguente esegue la nostra operazione di recupero. Quando facciamo q=…, cerca nel server e restituisce i risultati.
Come puoi vedere da questo esempio, cospargiamo UIState nel mezzo. Passiamo al recupero prima dell'estrazione dei dati, al recupero dopo la ricezione dei dati e allo stato di errore se si verifica un errore.
E in base a questo stato, eseguiamo l'operazione di rendering sullo schermo.
Un problema importante qui è che ogni volta che premiamo il tasto della tastiera, il backend non invia un'operazione di recupero, avvia l'operazione di ricerca se c'è un cambiamento nella parola cercata inserendo intervalli di 0,5 secondi tra di loro.
Per questo abbiamo bisogno di rimbalzare. Eseguendo una ricerca con i valori accumulati in 0,5 secondi con un certo timer, non stanchiamo il backend più del necessario.
Codice sorgente
- Reagisci al recupero del campione
È possibile fare clic su questo collegamento per accedere al resto di questo articolo o ad altri articoli nel gruppo di articoli .
Suggested posts
Evitare le conseguenze devastanti di un ictus: imparare dal viaggio di una famiglia.
Introduzione Un ictus è un'emergenza medica che può colpire chiunque in qualsiasi momento. Si verifica quando il flusso sanguigno verso una parte del cervello viene interrotto, portando a un'improvvisa perdita della funzione cerebrale.
Le mie risorse di codifica più utilizzate
Questa settimana ho ricevuto un'e-mail da un membro della mailing list quotidiana. Volevano sapere: quali risorse visiti giornalmente, settimanalmente e mensilmente? Ottima domanda! Sono felice di provare a condividere alcune informazioni sul mio flusso di lavoro e sulle migliori risorse che utilizzo.
Related posts
Rete televisiva Twitter
Ciò che è vecchio ora è di nuovo nuovo e ciò che prima era la cosa luccicante e scintillante ora sembra noioso. Non sto parlando dei jeans JNCO che stanno tornando in auge tra i ragazzi fighi del centro insieme ad altre mode di fine anni '90.
L'assassinio di Jordan Neely e il problema del razzismo "patriottico".
Gli Stati Uniti possono fare il passo essenziale per non equiparare il comportamento razzista all'essere un buon americano?
[Avviso di attivazione: questo saggio include schermate di persone che elogiano l'assassino di Jordan Neely.] I funzionari delle forze dell'ordine hanno finalmente - e forse con riluttanza - accusato Daniel Penny, l'uomo che ha soffocato Jordan Neely fino alla sua morte, per quell'omicidio.
La sfida di lettura di Goodreads è tossica
Il prurito alla mano si diffuse mentre mercanteggiavo con il libraio locale per un altro libro. Questo libro, come il resto che ho acquistato di recente, troverebbe il suo trono nella mia pila "Da leggere" (TBR); eppure l'ho comprato.