Estoy aprendiendo javascript. Estoy creando mi aplicación de notas, pero me muestra un error. Por favor ayuda a resolverlo.
let addBtn = document.getElementById('addBtn'); addBtn.addEventListener('click', function(e) { let addTxt = document.getElementById("addTxt").value; let notes = localStorage.getItem("notes"); if (notes == null) { notesObj = []; } else { notesObj = JSON.parse(notes); } notes.push(addTxt); localStorage.setItem("notes", JSON.stringify(notes)); addTxt.value = ""; console.log(notes); console.log("clicked"); })Debería estar presionando notesObj y encadenando eso cuando guarde de nuevo en localStorage .
Además, addTxt es una cadena, no el elemento de entrada. Para borrar el elemento de entrada, debe establecer el valor del elemento, no la cadena.
let addBtn = document.getElementById('addBtn'); addBtn.addEventListener('click', function(e) { let addTxt = document.getElementById("addTxt").value; let notes = localStorage.getItem("notes"); if (notes == null) { notesObj = []; } else { notesObj = JSON.parse(notes); } noteObjs.push(addTxt); localStorage.setItem("notes", JSON.stringify(notesObj)); document.getElementById("addTxt").value = ""; console.log(notes); console.log("clicked"); })Como se dijo en los comentarios: presione en la matriz analizada, no en la cadena recuperada de LS.
Aquí hay una nueva versión más agradable:
// DOM utility functions: const EL = (sel, par) => (par || document).querySelector(sel); // Task: const EL_add = EL("#addBtn"); const EL_txt = EL("#addTxt"); EL_add.addEventListener("click", (evt) => { // Prevent default browser action evt.preventDefault(); // Trim your values from spaces! const addTxt = EL_txt.value.trim(); // No text, do nothing if (!addTxt) return; // Get nodes from LS or fallback to empty Array const notesArr = JSON.parse(localStorage.notes || "[]"); // Add note notesArr.push(addTxt); // Save note localStorage.notes = JSON.stringify(notesArr); // Reset input value EL_txt.value = ""; })En primer lugar, las notas son una cadena, lo cual está bien. ¿Pero notesObj es una matriz o un objeto? si note es nulo, es una matriz, pero de lo contrario es un objeto. Esta inconsistencia hace que notes.push(addTxt) que solo está disponible para la matriz. Cuando hay cosas en push , no hay una función de inserción para el objeto, por lo que generará un error. Para solucionarlo, cree una propiedad en el objeto de notas, como 'datos', que luego puede hacer notesObj.data.push(txt) , también, cuando el objeto es nulo, conviértalo en {data:[]}