Challenge: Implement a Car List Filter with useMemo
Task
Create the CarList
component responsible for rendering a list of cars and providing a search functionality to filter them based on their names. It allows users to enter a search term and dynamically filters the list of cars based on that input.
Instructions
- Import the necessary hooks from the React library.
- Inside the
CarList
component, declare a state variablesearchInput
and a state updater functionsetSearchInput
using theuseState
hook. InitializesearchInput
with an empty string. - Use the
useMemo
hook to memoize thefilteredCars
array. The memoization logic should filter the cars based on thesearchInput
. IfsearchInput
is empty, return all cars; otherwise, filter the cars based on the search input. - In the
useMemo
dependency array, specify the correct variables the memoized function depends on.
Takk for tilbakemeldingene dine!