Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Erro na importação

Bom dia a todos. Quando rodo o sistema me traz erro na importação.

import Input from "../Input";
import styled from "styled-components";
import { useState } from "react";
import { livros } from "./dadosPesquisa";

const PesquisaContainer = styled.section`
  background-image: linear-gradient(90deg, #002f52 35%, #326589 165%);
  color: #fff;
  text-align: center;
  padding: 85px 0;
  height: 270px;
  width: 100%;
`;

const Titulo = styled.h2`
  color: #fff;
  font-size: 36px;
  text-align: center;
  width: 100%;
`;

const SubTitulo = styled.h3`
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 40px;
`;

function Pesquisa() {
    const [livrosPesquisados, setLivrosPesquisados] = useState([]);
    console.log(livrosPesquisados);
  return (
    <PesquisaContainer>
      <Titulo> Já sabe por onde começar?</Titulo>
      <SubTitulo>Encontre seu livro em nossa estante</SubTitulo>
      <Input
        placeholder="Escreva sua próxima leitura"
        onBlur={ evento => {
          const textoDigitado = evento.target.value
          const resultadoPesquisa = livros.filter(livro => livro.nome.include(textoDigitado))
          setLivrosPesquisados(resultadoPesquisa);
        }}
      />

    </PesquisaContainer>
  );
}

export default Pesquisa;


import livro from '../../imagens/livro.png'

export const livros = [
    {nome: 'Liderança em Design', id: 1, src: livro},
    {nome: 'JavaScript Assertivo', id: 2, src:livro},
    {nome: 'Cangaceiro em JavaScript', id: 3, src:livro},
    {nome: 'Aventureiros do Java', id: 4, src:livro},
]
4 respostas

Oii, José! Tudo bem?

Obrigada por disponibilizar o trecho do seu código, nele pude observar alguns pontos de melhorias que podem ajudar. Veja:

  • No método includes na função de filtro, você está passando o método include sem o S. Sugiro que corrija essa parte do código assim:
const resultadoPesquisa = livros.filter(livro => livro.nome.includes(textoDigitado));
  • Verifique se que o arquivo Input está localizado no diretório ../Input em relação ao arquivo em que você está importando.

Dentro do arquivo dadosPesquisa, está sendo importando um objeto chamado livros, cheque se o caminho para o arquivo está correto e se o arquivo de fato exporta um objeto chamado livros.

Se após realizar os passos acima, corrigindo a sintaxe e o verificando os caminhos dos arquivos, e o erro continuar, peço por gentileza que envie o print da tela mostrando o erro que está sendo retornado. Dessa forma, vamos buscar outras soluções para o problema.

Espero ter ajudado.

Bons estudos, José!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!

Oi NATHALIA QUEIROZ fiz al alterações conforme orientações mas ainda esta com erro, segue print da tela.

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

Tirei os colchetes do livros no import e funcionou (import livros from "./dadosPesquisa";), porém agora me traz outro erro quando faço o filtro.

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

solução!

Consegui resolver o arquivo dadosPesquisa estava sem o js no final.