스토리지 데이터에 하나만 안지워 지네요
스토리지 데이터에 다른건 다 삭제 되는데 하나 남았을때 삭제가 안되네요 전체 삭제하든 더블클릭으로 삭제하든 삭제가 안되네요 추가적으로 전체삭제를 해도 데이터가 안지워 지네요 ㅠㅠ
코드입니다.
const todoInput = document.querySelector("#todo-input");
const todoList = document.querySelector("#todo-list");
//로컬스토리지에서 데이터 빼오기
const savedTodoList = JSON.parse(localStorage.getItem("saved-items"));
const createTodo = function (storageData) {
//할일 추가 함수
let todoContents = todoInput.value;
if (storageData) {
todoContents = storageData.contents;
}
const newLi = document.createElement("li");
const newSpan = document.createElement("span");
const newBtn = document.createElement("button");
//할일 완료 이벤트
newBtn.addEventListener("click", () => {
newLi.classList.toggle("complete");
saveItemsFn();
});
//할일 삭제 이벤트
newLi.addEventListener("dblclick", () => {
newLi.remove();
saveItemsFn();
});
if (storageData?.complete) {
newLi.classList.add("complete");
}
newSpan.textContent = todoContents;
newLi.appendChild(newBtn);
newLi.appendChild(newSpan);
todoList.appendChild(newLi);
todoInput.value = "";
saveItemsFn();
};
const keyCodeCheck = function () {
//할일 추가 실행 함수
if (window.event.keyCode === 13 && todoInput.value !== "") {
createTodo();
}
};
const deleteAll = function () {
//전체 삭제 함수
const liList = document.querySelectorAll("li");
for (let i = 0; i < liList.length; i++) {
liList[i].remove();
}
saveItemsFn();
};
const saveItemsFn = function () {
//할일 저장 함수(네트워크 스토리지에)
const saveItems = [];
for (let i = 0; i < todoList.children.length; i++) {
const todoObj = {
contents: todoList.children[i].querySelector("span").textContent,
complete: todoList.children[i].classList.contains("complete"),
};
saveItems.push(todoObj);
}
saveItems.length === 0
? localStorage.removeItem("saved-Items")
: localStorage.setItem("saved-items", JSON.stringify(saveItems));
};
if (savedTodoList) {
for (let i = 0; i < savedTodoList.length; i++) {
createTodo(savedTodoList[i]);
}
}
답변 1
0
안녕하세요! 우혁님!
해당 JS 코드를 복사하여 실행해 보니, 정상적으로 동작하는 것 같아요!
개별 삭제는 더블클릭으로 잘 되고, 전체삭제 버튼도 역시 클릭하면 잘 되는 것 같아요!
혹시 문제가 있다면, HTML에서 오류가 있는 것은 아닌지 확인해 보는게 좋을 것 같아요!
fetchBoardsOfMine, fetchBoardsCountOfMine 에러 문의드립니다
0
41
1
댓글 기능 구현 중 질문드립니다.
0
67
1
쿠폰코드 발급
0
147
2
example 서버 플레이그라운드, API 접속 모두 안됩니다.
0
89
2
문의드립니다!! ㅠㅠ
0
106
2
graphql 백엔드 서버가 포폴용 빼곤 접속이 안됩니다.
0
80
2
_app.js 작성 이후로 에러가 발생하네요
0
96
2
학습자료
0
72
2
학습자료가 안열립니다.
0
51
2
플레이 그라운드 퀴즈 문제 질문이 있습니다.
0
61
0
기존강의 구매자, 업데이트 끝인가요?
0
111
3
업데이트 버전 수강
0
89
2
완벽한 프론트엔드
0
136
2
나만의 쇼핑몰 샘플 페이지 접속 확인부탁드립니다.
0
84
1
graphql 접속이 안됩니다.
0
101
2
const, let 사용 질문 드립니다.
0
72
2
싸이월드 만들기 1탄 피드백 부탁드립니다.
0
123
2
회원가입 과제 피드백 부탁드립니다.
0
81
2
styled.span / styled.input "CSS 자동완성"
0
47
1
쿠폰 발급 관련
0
167
2
서버 502 error
0
247
2
쿠폰 다시 부탁드려도 될가여?
0
140
2
a태그 패딩했을때 왜 크기가 줄어들지 않고 늘어나나요
0
185
2
2분 44초 질문
0
132
3





