1
resposta

[Dúvida] Alteração na função atualizar elemento

Bom, no vídeo a função atualizar elemento ele faz com que o número da quantidade seja um novo valor, eu queria fazer uma alteração para que o valor seja somado com o antigo, porém estou com problemas para fazer, notei que o objeto com com o nome e quantidade são do tipo strings, quando fui tentar somar ele somou duas strings e como esperado não somou, por exemplo: Há 5 camisas, quando coloco mais 5 fica 55, sei que é um problema de lógica mas não sei como resolver, tentei usar o parseInt para mudar tipo number mas não funcionou. Abaixo está meu código

const form = document.querySelector('form')
const itens = JSON.parse((localStorage.getItem("itens"))) || []

itens.forEach( (elemento) => {
    createElement(elemento)
})

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

    const nameForm = event.target['nome']
    const quantityForm = event.target['quantidade']

    const itensList = {
        "name": nameForm.value,
        "quantity": parseInt(quantityForm.value)
    }

    console.log(itensList.quantity)

    const exist = itens.find( elemento => elemento.name === nameForm.value)

    if(exist) {
        itensList.id = exist.id
        updateElement(itensList)
    } else {
        itensList.id = itens.length

        createElement(itensList)
        itens.push(itensList)
    }

    localStorage.setItem("itens", JSON.stringify(itens))
    nameForm.value = ""
    quantityForm.value = ""

    console.log(exist)

})

function createElement(item) {
    const newItem = document.createElement('li')
    newItem.classList.add('item')

    const quantityItem = document.createElement('strong')
    quantityItem.dataset.id = item.id

    quantityItem.innerHTML += item.quantity
    newItem.appendChild(quantityItem)
    newItem.innerHTML += item.name

    const list = document.querySelector('#list')
    list.appendChild(newItem)

}

function updateElement(updateItem) {
    document.querySelector(`[data-id="${updateItem.id}"]`).innerHTML += parseInt(updateItem.quantity)
1 resposta

Quando você tenta somar o innerHTML + número inteiro, ele só concatena.

Tente fazer ao invés disso:

quantityItem.innerHTML += item.quantity

Tente fazer isso:

let quantity = parseInt(quantityItem.innerHTML)
quantityItem.innerHTML = quantity + item.quantity

se for na funcao: updateElement

function updateElement(updateItem) {
    document.querySelector(`[data-id="${updateItem.id}"]`).innerHTML += parseInt(updateItem.quantity)
}

Tente isso:

function updateElement(updateItem) {
    const quantity = document.querySelector(`[data-id="${updateItem.id}"]`).innerHTML;
return quantity + parseInt(updateItem.quantity);

}