Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Barra de Pesquisa não está filtrando

Implementei a lógica assim como a instrutora fez, porém a barra de pesquisa continua não filtrando os vídeos, apenas recarrega a chamada a API e mostra todos os vídeos novamente. Não sei se tem relação, mas ao rodar o app no LiveServer, consumindo os dados da API através do JSON-Server, aparecem 10k pra mais erros de GET e POST de vídeos do youtube, ao invés do try catch interceptar o erro ele simplesmente passa. Possívelmente isso deve estar interferindo com a lógica de filtro da barr de pesquisa.

Repositório: https://github.com/vcdomith/VidFlow

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta
solução!

Oi, Vitor, tudo bem?

Identifiquei alguns problemas no arquivo script.js, vamos lá:

  1. Na linha 57, você está com esse código:

    barraPesquisa.addEventListener('input', filtrarPesquisa());
    

    Para adicionar a função filtrarPesquisa como ouvinte do evento input, você não pode passar os parênteses, senão sua função não será executada. Então corrija o código para o seguinte:

    barraPesquisa.addEventListener('input', filtrarPesquisa);
    
  2. O próximo problema é na linha 77, onde você tem esse código:

            const titulo = video.querySelector('.titulo-video')
    

    Para obter o título em si, e não o elemento HTML, você deve modificar o código para o seguinte:

            const titulo = video.querySelector('.titulo-video').textContent.toLowerCase();
    
  3. Por fim, na linha 81, você tem esse código:

    video.computedStyleMap.display = 'none'
    

    Em vez de computedStyleMap, você deve acessar a propriedade style do video. Então altere o código para o seguinte:

    video.style.display = "none";
    

Com essas modificações, seu projeto deve funcionar de volta :)

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software