No puedo obtener la entrada del usuario para enviar al almacenamiento local. Cuando mi variable quizData es una matriz vacía, funciona bien,
let quizData = JSON.parse(localStorage.getItem('MyQuiz'));y cambiarlo de nuevo a esto funciona porque (supongo) ya hay información en LS,
let quizData = JSON.parse(localStorage.getItem('MyQuiz'));pero borrar LS hará que vuelva a fallar. Cualquier ayuda que pueda obtener sería muy apreciada.
let quizData = JSON.parse(localStorage.getItem('MyQuiz')); const addQuiz = (ev) => { ev.preventDefault(); let quizForm = { question: document.getElementById('question-input').value, a: document.getElementById('a-input').value, b: document.getElementById('b-input').value, c: document.getElementById('c-input').value, d: document.getElementById('d-input').value, correct: document.getElementById('correct-input').value, }; quizData.push(quizForm); document.forms[0].reset(); console.warn('added', { quizData }); localStorage.setItem('MyQuiz', JSON.stringify(quizData)); }; document.addEventListener('DOMContentLoaded', () => { document.getElementById('submitForm').addEventListener('click', addQuiz); console.log(quizData); });y el error custom-questions.js:26
TypeError no capturado: no se pueden leer las propiedades de nulo (leyendo 'push') en HTMLButtonElement.addQuiz
Simplemente puede configurar quizData en una nueva matriz si no hay nada en localStorage .
let quizData = JSON.parse(localStorage.getItem('MyQuiz')) ?? []; Si quizData se actualiza en otro lugar, es mejor recuperar la matriz más reciente antes de actualizarla. Para que pueda obtener los últimos quizData dentro addQuiz .
const addQuiz = (ev) => { ev.preventDefault(); let quizForm = { question: document.getElementById('question-input').value, a: document.getElementById('a-input').value, b: document.getElementById('b-input').value, c: document.getElementById('c-input').value, d: document.getElementById('d-input').value, correct: document.getElementById('correct-input').value, }; const quizData = JSON.parse(localStorage.getItem('MyQuiz')) ?? []; quizData.push(quizForm); document.forms[0].reset(); console.warn('added', { quizData }); localStorage.setItem('MyQuiz', JSON.stringify(quizData)); };Debe inicializar quizData como una matriz vacía si es nulo o indefinido.
let quizData = JSON.parse(localStorage.getItem('MyQuiz')) || [];