Entrar Ainda não tem acesso?
3
respostas

nao consegui ajustar o carrinho

Referente ao curso Lógica de programação: praticando com desafios, no capítulo Projeto Carrinho de Compras e atividade Faça como eu fiz: comprando produtos

por Leonardo Stein Pelisari
| 6.7k xp | 9 posts

sempre no final acontece isso

3 Celular R$ 0.00 no carrinho , e a luri nem parece que sabe oque esta fazendo eu pedi ajuda obv , e nao ajudou em nada , começou a tacar replace e trim no codigo

function add() { let p = document.getElementById('produto').value; console.log("Valor do produto:", p);

let np = p.split('-')[0].trim(); 


let valorU = p.split('R$ ')[1];


valorU = valorU ? valorU.trim() : '0'; 


let valorUnitario = parseFloat(valorU); 

let q = parseInt(document.getElementById('quantidade').value);
let pç = q * valorUnitario;

let carrinho = document.getElementById('lista-produtos');
carrinho.innerHTML += `<section class="carrinho__produtos__produto">
<span class="texto-azul">${q}</span> ${np} <span class="texto-azul">R$ ${pç.toFixed(2)}</span>
</section>`;

}

function limpar() { let carrinho = document.getElementById('lista-produtos'); carrinho.innerHTML = ''; }

3 respostas
por Eduardo Fernandes De Magalhaes Pimenta
| 7.4k xp | 13 posts
Auditor financeiro, FullStack Web Dev, Analista de Dados

Oi Leonardo,

Seria interessante compartilhar o HTML também para que a gente saiba o que você está tentando fazer. Por exemplo, eu não faço a menor ideia sobre o tipo de String que essa linha está transformando em Array let np = p.split("-")[0].trim().

por Leonardo Stein Pelisari
| 6.7k xp | 9 posts

np seria nome produto kkkkk , eu gosto de abreviar as variaveis , aprendi com python , agora . trim eu nao tenho ideia oque é , isso foi a luri

Carrinho de compras 

  <form class="formulario">
    <label class="campo-grupo">
      <span class="texto-medio-azul">Produto</span>
      <select class="produto-input" name="produto" id="produto">
        <option value="Fone de ouvido - R$100">Fone de ouvido - R$100</option>
        <option value="Celular - R$1400">Celular - R$1400</option>
        <option value="Oculus VR - R$5000">Oculus VR - R$5000</option>
      </select>
      </div>
    </label>

    <section class="parte-inferior">
      <label class="campo-grupo">
        <span class="texto-medio-azul">Qtde.</span>
        <input class="quantidade-input" id="quantidade" type="number" placeholder="100">
      </label>

      <section class="botoes-wrapper">
        <button onclick="add()" type="button" class="botao-form botao-adicionar">Adicionar</button>
        <button onclick="limpar()" type="button" class="botao-form botao-limpar">Limpar</button>
      </section>
    </section>
  </form>
</section>
<section class="carrinho">
  <img src="./assets/carrinho-cinza.svg" alt="Imagem de um carrinho de compras cinza">

  <div class="titulo-wrapper">
    <img src="./assets/icone-carrinho.svg" alt="ícone de carrinho">

    <h2 class="carrinho__titulo">Produtos no carrinho</h2>
  </div>

  <section class="carrinho__produtos" id="lista-produtos">
    <section class="carrinho__produtos__produto">
      <span class="texto-azul">1x</span> Celular <span class="texto-azul">R$1400</span>
    </section>
  </section>

  <div class="divisoria"></div>

  <p class="carrinho__total">
    Total: <span class="texto-azul" id="valor-total">R$1400</span>
  </p>
</section>
por Eduardo Fernandes De Magalhaes Pimenta
| 7.4k xp | 13 posts
Auditor financeiro, FullStack Web Dev, Analista de Dados

O método trim() da String vai remover espaços em branco ao final de um texto.

const p = "Fone de ouvido - R$100";
p.split("-")[0];  // "Fone de ouvido " com um espaço em branco no final e
p.split("-")[0].trim(); // "Fone de ouvido" sem o espaço em branco no final

Mas o problema está no segundo split(). Quando você usa a String "R$ " como separador, o JavaScript não separa nada porque não existe essa sequência exata de caracteres.

const p = "Fone de ouvido - R$100";
p.split("R$ "); // ['Fone de ouvido - R$100'] Um Array com 1 único elemento
p.split("R$ ")[1]; // undefined, porque não há um segundo elemento na Array

p.split("R$") // ['Fone de ouvido - ', '100'], Array de 2 elementos quando usa o separador sem o espaço
p.split("R$")[1] // '100'

Aí o seu valorU = valorU ? valorU.trim() : "0" vai ser sempre avaliado como falso (undefined é falso) pelo operador ternário e consequentemente valorU será igual a "0". Por isso o preço final está igual a R$ 0,00.

Resumindo: corrige essa linha, de let valorU = p.split("R$ ")[1], para let valorU = p.split("R$")[1]. Aí deve funcionar beleza.

Espero que tenha ajudado. =)

Happy coding!