Utfordring: Implementer Et Bilfilter Med useMemo
Oppgave
Lag komponenten CarList som har ansvar for å vise en liste over biler og tilby en søkefunksjon for å filtrere dem basert på navn. Den lar brukere skrive inn et søkeord og filtrerer listen over biler dynamisk basert på dette.
Instruksjoner
- Importer nødvendige hooks fra React-biblioteket.
- Inne i
CarList-komponenten, deklarer en tilstandsvariabelsearchInputog en oppdateringsfunksjonsetSearchInputved å brukeuseState-hooken. InitialisersearchInputmed en tom streng. - Bruk
useMemo-hooken for å memoizefilteredCars-arrayet. Memoiseringslogikken skal filtrere bilene basert påsearchInput. HvissearchInputer tom, returner alle biler; ellers filtrer bilene basert på søkeordet. - I avhengighetsarrayen til
useMemo, spesifiser de riktige variablene den memoiserte funksjonen er avhengig av.
- Inkluder en
import-setning for å importere nødvendig hook fra React-biblioteket. - Bruk
useState-hooken for å deklarere en tilstandsvariabel og dens oppdateringsfunksjon. useMemo-hooken memoiserer det filtrerte bil-arrayet og forhindrer unødvendige beregninger.- I avhengighetsarrayen til
useMemo, inkluder variablene som den memoiserte funksjonen er avhengig av (carsogsearchInput).
Alt var klart?
Takk for tilbakemeldingene dine!
Seksjon 3. Kapittel 9
Spør AI
Spør AI
Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår
Awesome!
Completion rate improved to 2.17
Utfordring: Implementer Et Bilfilter Med useMemo
Sveip for å vise menyen
Oppgave
Lag komponenten CarList som har ansvar for å vise en liste over biler og tilby en søkefunksjon for å filtrere dem basert på navn. Den lar brukere skrive inn et søkeord og filtrerer listen over biler dynamisk basert på dette.
Instruksjoner
- Importer nødvendige hooks fra React-biblioteket.
- Inne i
CarList-komponenten, deklarer en tilstandsvariabelsearchInputog en oppdateringsfunksjonsetSearchInputved å brukeuseState-hooken. InitialisersearchInputmed en tom streng. - Bruk
useMemo-hooken for å memoizefilteredCars-arrayet. Memoiseringslogikken skal filtrere bilene basert påsearchInput. HvissearchInputer tom, returner alle biler; ellers filtrer bilene basert på søkeordet. - I avhengighetsarrayen til
useMemo, spesifiser de riktige variablene den memoiserte funksjonen er avhengig av.
- Inkluder en
import-setning for å importere nødvendig hook fra React-biblioteket. - Bruk
useState-hooken for å deklarere en tilstandsvariabel og dens oppdateringsfunksjon. useMemo-hooken memoiserer det filtrerte bil-arrayet og forhindrer unødvendige beregninger.- I avhengighetsarrayen til
useMemo, inkluder variablene som den memoiserte funksjonen er avhengig av (carsogsearchInput).
Alt var klart?
Takk for tilbakemeldingene dine!
Seksjon 3. Kapittel 9