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

[DUVIDA] não atualiza os itens no localStorage

Creio que meu codigo está bem parecido com o do professor, porem quando atualizo o numero de um item ele não é atualizado no localStorage, oque pode ser? esse é o meu cogido:

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

itens.forEach((elemento) => { criaElemento(elemento); })

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

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

const existe = itens.find(elemento => elemento.nome === nome.value);

const itemAtual = {
    "nome": nome.value,
    "quantidade":quantidade.value
}

if (existe) {
    itemAtual.id = existe.id

    atualizaElemento(itemAtual)

    itens[existe.id] = itemAtual;
}else{
    itemAtual.id = itens.length;

    criaElemento(itemAtual);

    itens.push(itemAtual)
}

localStorage.setItem("itens", JSON.stringify(itens));

nome.value = "";
quantidade.value = "";

})

function criaElemento(item) { const novoItem = document.createElement('li'); novoItem.classList.add("item");

const numeroItem = document.createElement('strong');
numeroItem.innerHTML = item.quantidade;
numeroItem.dataset.id = item.id
novoItem.appendChild(numeroItem);

novoItem.innerHTML += item.nome;

lista.appendChild(novoItem);

}

function atualizaElemento(item){ document.querySelector("[data-id='"+item.id+"']").innerHTML = item.quantidade }

2 respostas
solução!

Olá Alice, tudo bem com você? Espero que sim...

Eu copiei e colei seu código para testar:

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

itens.forEach((elemento) => { criaElemento(elemento); })

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

    const nome = evento.target.elements['nome'];
    const quantidade = evento.target.elements['quantidade'];
    const existe = itens.find(elemento => elemento.nome === nome.value);

    const itemAtual = {
        "nome": nome.value,
        "quantidade": quantidade.value
    }

    if (existe) {
        itemAtual.id = existe.id
        atualizaElemento(itemAtual)
        itens[existe.id] = itemAtual;
    } else {
        itemAtual.id = itens.length;
        criaElemento(itemAtual);
        itens.push(itemAtual)
    }

    localStorage.setItem("itens", JSON.stringify(itens));

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

function criaElemento(item) {
    const novoItem = document.createElement('li'); novoItem.classList.add("item");

    const numeroItem = document.createElement('strong');
    numeroItem.innerHTML = item.quantidade;
    numeroItem.dataset.id = item.id
    novoItem.appendChild(numeroItem);
    novoItem.innerHTML += item.nome;
    lista.appendChild(novoItem);
}

function atualizaElemento(item) {
    document.querySelector("[data-id='" + item.id + "']").innerHTML = item.quantidade
}

Funcionou perfeitamente, da uma olhada no vídeo:

https://www.youtube.com/watch?v=SIcN0PMBSO8

Poderia monstra pra gente o que esta acontecendo no seu localStorage? Ou se tiver mais informações sobre alguma mensagem de erro, ou quem sabe nos passar o link do seu repositório no GitHub, gostaria muito de ajuda-la a entender o que esta acontecendo e resolver o problema.

Desculpa não conseguir ajudar mais que isso.

Uma ótima semana e bons estudos.

Caso este post tenha lhe ajudado, por favor, marcar como solucionado .

Faltou atualização na pagina, tentei novamente e deu tudo certo! obrigada pela ajuda.