Desafio: Implemente um Filtro de Lista de Carros com useMemo
Tarefa
Criar o componente CarList responsável por renderizar uma lista de carros e fornecer uma funcionalidade de busca para filtrá-los com base em seus nomes. Permite que os usuários insiram um termo de pesquisa e filtre dinamicamente a lista de carros conforme essa entrada.
Instruções
- Importar os hooks necessários da biblioteca React.
- Dentro do componente
CarList, declarar uma variável de estadosearchInpute uma função atualizadora de estadosetSearchInpututilizando o hookuseState. InicializarsearchInputcom uma string vazia. - Utilizar o hook
useMemopara memorizar o arrayfilteredCars. A lógica de memoização deve filtrar os carros com base nosearchInput. SesearchInputestiver vazio, retornar todos os carros; caso contrário, filtrar os carros conforme a entrada de pesquisa. - No array de dependências do
useMemo, especificar as variáveis corretas das quais a função memoizada depende.
- Incluir uma declaração
importpara importar o hook necessário da biblioteca React. - Utilizar o hook
useStatepara declarar uma variável de estado e sua função de atualização. - O hook
useMemomemoriza o array de carros filtrados, evitando recálculos desnecessários. - No array de dependências do
useMemo, incluir as variáveis das quais a função memoizada depende (carsesearchInput).
Tudo estava claro?
Obrigado pelo seu feedback!
Seção 3. Capítulo 9
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Incrível!
Completion taxa melhorada para 2.17
Desafio: Implemente um Filtro de Lista de Carros com useMemo
Deslize para mostrar o menu
Tarefa
Criar o componente CarList responsável por renderizar uma lista de carros e fornecer uma funcionalidade de busca para filtrá-los com base em seus nomes. Permite que os usuários insiram um termo de pesquisa e filtre dinamicamente a lista de carros conforme essa entrada.
Instruções
- Importar os hooks necessários da biblioteca React.
- Dentro do componente
CarList, declarar uma variável de estadosearchInpute uma função atualizadora de estadosetSearchInpututilizando o hookuseState. InicializarsearchInputcom uma string vazia. - Utilizar o hook
useMemopara memorizar o arrayfilteredCars. A lógica de memoização deve filtrar os carros com base nosearchInput. SesearchInputestiver vazio, retornar todos os carros; caso contrário, filtrar os carros conforme a entrada de pesquisa. - No array de dependências do
useMemo, especificar as variáveis corretas das quais a função memoizada depende.
- Incluir uma declaração
importpara importar o hook necessário da biblioteca React. - Utilizar o hook
useStatepara declarar uma variável de estado e sua função de atualização. - O hook
useMemomemoriza o array de carros filtrados, evitando recálculos desnecessários. - No array de dependências do
useMemo, incluir as variáveis das quais a função memoizada depende (carsesearchInput).
Tudo estava claro?
Obrigado pelo seu feedback!
Seção 3. Capítulo 9