Localstorage 안의 데이터 삭제

에러

게시판 작성이나 수정시 30초마다 임시저장기능을 구현해서 데이터를 localstorage에 저장했다. 그런데 게시판을 등록하고 나서 게시판 작성이나 수정 페이지를 다시 들어가면 작성했던 게시글이 남아있다는 알람창이 뜨는 에러가 발생했다.

 

원인

localstorage의 데이터를 지우지 않아 계속 남아있기 때문이었다.

 

해결

게시판의 작성과 수정 완료시 localstorage.remove('editData')를 사용하여 저장되어있는 데이터를 삭제한다.

axios.post(`/boards`, newBoard)
.then((res) => {
  localStorage.removeItem('data'); // 수정한 부분
  navigate('/board/list');
  alert('성공적으로 작성되었습니다.');
})
.catch((err) => console.log(Error, err));

 

참고

- https://developer.mozilla.org/ko/docs/Web/API/Storage/removeItem