Taak

Maak de CarList-component die verantwoordelijk is voor het weergeven van een lijst met auto's en het bieden van een zoekfunctionaliteit om deze te filteren op basis van hun namen. Hiermee kunnen gebruikers een zoekterm invoeren en wordt de lijst met auto's dynamisch gefilterd op basis van die invoer.

Instructies

1. Importeer de benodigde hooks uit de React-bibliotheek.
2. Declareer binnen de CarList-component een statusvariabele searchInput en een status-updatefunctie setSearchInput met behulp van de useState-hook. Initialiseer searchInput met een lege string.
3. Gebruik de useMemo-hook om de array filteredCars te memoïseren. De memoïseringslogica moet de auto's filteren op basis van searchInput. Als searchInput leeg is, geef dan alle auto's weer; filter anders de auto's op basis van de zoekinvoer.
4. Geef in de dependency array van useMemo de juiste variabelen op waarvan de memoïseringsfunctie afhankelijk is.

1. Voeg een import-statement toe om de benodigde hook uit de React-bibliotheek te importeren.
2. Gebruik de useState-hook om een statusvariabele en de bijbehorende updatefunctie te declareren.
3. De useMemo-hook memoïseert de gefilterde auto-array, waardoor onnodige herberekeningen worden voorkomen.
4. Neem in de dependency array van useMemo de variabelen op waarvan de memoïseringsfunctie afhankelijk is (cars en searchInput).