Estou tentando formas de fazer um carrinho de compras funcional
Meu carrinho de compras fica alocado no localStorage
. O botão adicionar produtos funciona perfeitamente. Porém, gostaria de fazer um push
condicional, caso já exista o mesmo produto dentro do array
de objetos, ele incremente +1 quantidade e NÃO criar um novo objeto, evitado gerar um objeto repetido, para que assim eu possa renderizar a página com os produtos selecionados x quantidade de cada.
Por exemplo:
Produto | Quantidade |
---|---|
iPad | 1 |
TV | 1 |
Celular | 2 |
- O que preciso fazer?
- Tentei usando
filter
,find
,includes
. Mas não consigo aplicar no minhas ideias no código.
<!-- a função é um onclick de um produto(objeto). -->
<button onclick="addCarrinhos('<%= produtos.nome %>', document.getElementById('qtd').value, '<%= produtos.valor %>','<%= produtos.id %>')">Adicionar ao Carrinho</button>
function addCarrinhos(produto, qtd, valor, id) {
//neste bloco, eu capturo os valores do meu objeto
const produtos = {
nomeProduto: produto,
quantidade: qtd,
valorProduto: valor,
id: id
}
//aqui verifico se está em branco, mas irei retirar depois, por que é inutil no meu codigo
if (produtos === '') {
alert('é necessário informar')
//neste bloco ele adiciona o produto caso o valor de localStorage seja nulo convertendo para string
} else {
if (localStorage.getItem('produtos') === null) {
let listaProdutos = [produtos]
localStorage.setItem('produtos', JSON.stringify(listaProdutos));
//neste bloco eu transformo em objeto a string alocada no localStorage com o parse
} else {
let listaProdutos = JSON.parse(localStorage.getItem('produtos'));
//aqui faço push do novo produto pra dentro de listaProdutos
listaProdutos.push(produtos);
//neste bloco faço um map, para retornar um novo array convertendo algumas strings para inteiros
let novoObjeto = Object.assign(listaProdutos.map(e => {
e.nomeProduto = e.nomeProduto
e.quantidade = parseInt(e.quantidade)
e.valorProduto = parseInt(e.valorProduto)
e.id = parseInt(e.id)
return e
}))
//aqui eu crei um novo array, que vai conter o retorno do novoObjeto
let novos = []
novos.push(novoObjeto)
}
//neste bloco adiciono no localStorage, o novo array
localStorage.setItem('produtos', JSON.stringify(novos[0]))
console.log('push funcionou')
}
}
console
do seu navegador? apresentou algum erro? coloquei sua função para rodar no meu e apresentou alguns erros, para que possamos lhe ajudar, nos dê mais detalhes (veja como criar um Exemplo Mínimo, Completo e Verificável)