1
resposta

[Projeto] Minha solução para esta aula

A única coisa que fiz de diferente foi criar uma função "adicionaItem" para oraganizar o código refatorado!

Segue ai a solução que quem quiser dar uma olhada.

const form = document.getElementById("novoItem");
const lista = document.getElementById("lista");
const listaItens = JSON.parse(localStorage.getItem("itens")) || [];

listaItens.forEach((element) => {
  criaElemento(element.nome, element.quantidade);
});

form.addEventListener("submit", (evento) => {
  evento.preventDefault();

  const nome = evento.target.elements["nome"];
  const quantidade = evento.target.elements["quantidade"];

  adicionaItem(nome.value, quantidade.value);

  nome.value = "";
  quantidade.value = "";
});

function criaElemento(nome, quantidade) {
  if (nome === "" || quantidade === "") {
  } else {
    const novoItem = document.createElement("li");
    novoItem.classList.add("item");

    const quantidadeItem = document.createElement("strong");
    quantidadeItem.innerHTML = quantidade;

    novoItem.appendChild(quantidadeItem);
    novoItem.innerHTML += nome;

    lista.appendChild(novoItem);
  }
}

function adicionaItem(nome, quantidade) {
  itemAtual = {
    nome: nome,
    quantidade: quantidade,


  };

  criaElemento(nome, quantidade);

  listaItens.push(itemAtual);

  localStorage.setItem("itens", JSON.stringify(listaItens));
}
1 resposta

Oii, Dev! Tudo bem?

Muito legal a sua solução para o projeto da aula de armazenamento de dados no navegador com JavaScript! É sempre importante refatorar o código para deixá-lo mais organizado e legível.

Parabéns pelo avanço nos estudos, continue praticando e interagindo com a comunidade aqui no fórum!

Bons estudos!

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