não aplica o desconto . | JavaScript: métodos de array | Alura

let livros =[];

const url ='https://guilhermeonrails.github.io/casadocodigo/livros.json';

async function getBuscarLivrosDaAPI(){ const reponse= await fetch(url); livros= await reponse.json(); let livrosComDesconto = aplicarDesconto(livros); exibirOsLivrosNaTela(livrosComDesconto);

console.table(livros)

}

getBuscarLivrosDaAPI()

function aplicarDesconto(livros){ const desconto = 0.5; let livrosComDesconto = livros.map(livro =>{ return {...livro, preco: livro.preco -(livro.preco*desconto)} }) return livrosComDesconto }

const elementoParaInserirLivros =document.querySelector("#livros");

function exibirOsLivrosNaTela(livro){ livros.forEach(livro=>{ elementoParaInserirLivros.innerHTML += <div class="livro"> <img class="livro__imagens " src="${livro.imagem}" alt="${livro.alt}" /> <h2 class="livro__titulo"> ${wes.titulo} </h2> <p class="livro__descricao">${livro.autor}</p> <p class="livro__preco" id="preco">R$${livro.preco}</p> <div class="tags"> <span class="tag">Front-end</span> </div> </div> })

}

Olá João!

Parece que você está enfrentando um problema ao tentar aplicar descontos nos preços dos livros em seu código JavaScript. Vamos analisar o que pode estar acontecendo.

Ao exibir os livros na tela, você está utilizando a variável livros ao invés de livro dentro do forEach da função exibirOsLivrosNaTela. Isso pode estar causando confusão, pois livros refere-se ao array original sem desconto aplicado.

Além disso, há um erro de digitação na linha onde você tenta exibir o título do livro. Você escreveu wes.titulo, mas deveria ser livro.titulo. Isso provavelmente está causando um erro ao tentar acessar uma propriedade que não existe.

Aqui está uma versão corrigida da função exibirOsLivrosNaTela:

function exibirOsLivrosNaTela(livrosComDesconto){
    livrosComDesconto.forEach(livro => {
        elementoParaInserirLivros.innerHTML +=`
            <div class="livro">
                <img class="livro__imagens " src="${livro.imagem}"
                alt="${livro.alt}" />
                <h2 class="livro__titulo">
                ${livro.titulo}
                </h2>
                <p class="livro__descricao">${livro.autor}</p>
                <p class="livro__preco" id="preco">R$${livro.preco.toFixed(2)}</p>
                <div class="tags">
                    <span class="tag">Front-end</span>
                </div>
            </div>
        `
    })
}

Além disso, como mencionado na aula, você pode usar o método .toFixed(2) para formatar os preços com duas casas decimais, evitando assim a exibição de muitos números decimais.

Tente fazer essas alterações e veja se os descontos são aplicados corretamente e se os livros são exibidos com as informações corretas na tela, em caso de persistência, peço que você compartilhe o link do seu projeto no GitHub ou uma pasta com todos os arquivos que você utilizou no através do Google Drive. Dessa forma, conseguirei realizar os testes necessários e te ajudar de forma mais assertiva.

Lembre-se que, se enviar os arquivos por meio do Google Drive, é necessário conceder permissão para que eu possa ter acesso.

Reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso ✨

Um grande abraço e até mais!

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

Chegou a hora de transformar