Tengo un problema cuando intento crear y guardar objetos dentro de un arreglo y guardarlo en local storage. Me resulta, pero cada vez que añado uno nuevo se crea un arreglo dentro del arreglo anterior y no se como manejarlo. Les dejo el código y lo que sale por consola para que quede mas claro.
const form = document.querySelector('form');
const enviarBtn = document.querySelector('#enviar');
enviarBtn.addEventListener('click', function(event) {
event.preventDefault(); // Evita que se envíe el formulario
const datosVehiculo = {
nombre: document.getElementById('nombre').value,
rut: document.getElementById('rut').value,
patente: document.getElementById('patente').value,
marca: document.getElementById('marca').value,
modelo: document.getElementById('modelo').value,
color: document.getElementById('color').value
};
//Si hay datos
if (localStorage.getItem('datosVehiculo')) {
const datosGuardados = localStorage.getItem("datosVehiculo");
const datosVehiculoGuardados = JSON.parse(datosGuardados);
const arrVehiculo =[datosVehiculoGuardados]
console.log(datosVehiculoGuardados)
const arrDatos = [...arrVehiculo, datosVehiculo];
localStorage.setItem("datosVehiculo", JSON.stringify(arrDatos))
console.log("Hay datos en LS");
} else {
// Si no hay datos
localStorage.setItem("datosVehiculo", JSON.stringify(datosVehiculo))
}
});