En el video, ingrese el elemento "to Do" nuevamente a las 3:54, el antiguo "to Do" desaparece. Pero no desapareció en mi proyecto.
así que miré cuidadosamente mi código…
const toDoForm = document.querySelector("#todo-form"); const toDoInput = document.querySelector("#todo-form input"); const toDoList = document.querySelector("#todo-list"); const TODOS_KEY = "todos"; const toDos = []; function saveToDos(){ localStorage.setItem(TODOS_KEY, JSON.stringify(toDos)); } function deleteToDo(event){ const li = event.target.parentElement; li.remove(); } function paintToDo(newToDo){ const li = document.createElement("li"); const button = document.createElement("button"); const span = document.createElement("span"); span.innerText = newToDo; button.innerText = "✔"; button.addEventListener("click", deleteToDo); li.appendChild(span); li.appendChild(button); toDoList.appendChild(li); toDos.push(newToDo); saveToDos(); } function handleToDoSubmit(event){ event.preventDefault(); const newToDo = toDoInput.value; toDoInput.value=""; paintToDo(newToDo); } toDoForm.addEventListener("submit", handleToDoSubmit); const saveToDo = localStorage.getItem(TODOS_KEY); if (saveToDo !== null){ const parsedToDos = JSON.parse(saveToDo); parsedToDos.forEach(paintToDo); }entonces descubrí que
toDos.push(newToDo); saveToDos(); deberían existir en function paintToDo no en una function handleToDoSubmit
En el video, ingrese un elemento nuevo en la matriz en la web => elemento antiguo desaparecido en la matriz. Cuando lo hice con mi código, el elemento antiguo aún existe en la matriz con el elemento nuevo
Quiero entender por qué no ocurre el error y cómo el resultado es diferente entre el video y mi código.
¿Alguien puede ayudar con esto?