Udfordring: Implementer Et Bilfilter Med useMemo
Opgave
Opret CarList-komponenten, der er ansvarlig for at vise en liste over biler og give en søgefunktionalitet til at filtrere dem baseret på deres navne. Brugere kan indtaste et søgeord, og listen over biler filtreres dynamisk baseret på denne indtastning.
Instruktioner
- Importér de nødvendige hooks fra React-biblioteket.
- Inde i
CarList-komponenten erklæres en state-variabelsearchInputog en state-opdateringsfunktionsetSearchInputved hjælp afuseState-hooken. InitialisérsearchInputmed en tom streng. - Brug
useMemo-hooken til at memoizerefilteredCars-arrayet. Memoiseringslogikken skal filtrere bilerne baseret påsearchInput. HvissearchInputer tom, returneres alle biler; ellers filtreres bilerne baseret på søgeinputtet. - Angiv de korrekte variabler i dependency-arrayet for
useMemo, som den memoiserede funktion afhænger af.
- Inkludér en
import-sætning for at importere den nødvendige hook fra React-biblioteket. - Brug
useState-hooken til at erklære en state-variabel og dens opdateringsfunktion. useMemo-hooken memoizerer det filtrerede bil-array og forhindrer unødvendige genberegninger.- I dependency-arrayet for
useMemoinkluderes de variabler, som den memoiserede funktion afhænger af (carsogsearchInput).
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
Can you explain how the useMemo hook helps in this scenario?
What should the filteredCars array contain if the search input is empty?
Which variables should be included in the useMemo dependency array?
Awesome!
Completion rate improved to 2.17
Udfordring: Implementer Et Bilfilter Med useMemo
Stryg for at vise menuen
Opgave
Opret CarList-komponenten, der er ansvarlig for at vise en liste over biler og give en søgefunktionalitet til at filtrere dem baseret på deres navne. Brugere kan indtaste et søgeord, og listen over biler filtreres dynamisk baseret på denne indtastning.
Instruktioner
- Importér de nødvendige hooks fra React-biblioteket.
- Inde i
CarList-komponenten erklæres en state-variabelsearchInputog en state-opdateringsfunktionsetSearchInputved hjælp afuseState-hooken. InitialisérsearchInputmed en tom streng. - Brug
useMemo-hooken til at memoizerefilteredCars-arrayet. Memoiseringslogikken skal filtrere bilerne baseret påsearchInput. HvissearchInputer tom, returneres alle biler; ellers filtreres bilerne baseret på søgeinputtet. - Angiv de korrekte variabler i dependency-arrayet for
useMemo, som den memoiserede funktion afhænger af.
- Inkludér en
import-sætning for at importere den nødvendige hook fra React-biblioteket. - Brug
useState-hooken til at erklære en state-variabel og dens opdateringsfunktion. useMemo-hooken memoizerer det filtrerede bil-array og forhindrer unødvendige genberegninger.- I dependency-arrayet for
useMemoinkluderes de variabler, som den memoiserede funktion afhænger af (carsogsearchInput).
Tak for dine kommentarer!