04 BookBucket - 내가 읽을 책을 localStorage에 저장하자!📚[7.20]

책을 localStorage저장하는 과정에서 오류가 발생했다.

오류 : 새로고침하면 최근에 작성한 book은 없어진다.

 

let [addInputValue, setAddInputValue] = useState("");

let [listBook, setListBook] = useState([]);

 

const saveLocalStorage = () => {

window.localStorage.setItem("bookList", JSON.stringify(listBook));

};

increaseId : listBook.id lncrease

validateInput : 정규식테스트

 

원인 : React의 상태 업데이트가 비동기적으로 처리

listBook 상태가 업데이트되는 동안saveLocalStorage(listBook);가 호출되면서 listBook는 아직 업데이트되기 전의 이전 값을 유지

 

해결방안 : 

1. 상태 업데이트 이후에 saveLocalStorage 함수를 호출

2. 먼저 saveLocalStorage저장 후 setState함수 저장

 

 

 

먼저 saveLocalStorage저장 후 setState함수 저장