126일차 TIL : 최종프로젝트 - 반응형

에러

게시글 수정 페이지에서 전체 일정 열기/접기 토글 버튼 클릭시 마지막 여행지를 제외한 나머지 여행지의 저장된 메모 내용이 사라지는 버그

원인

  const [openCourse, setOpenCourse] = useState(false);

useState때문에 토글 버튼을 누르면 리렌더링이 되면서 메모 내용 일부가 초기화 된 거라고 추측

해결

  const data = useSelector((state: any) => state.courseSlice.courseList);
  const [lists, setLists] = useState(data);

(중략)

  useEffect(() => {
    setLists(data);
  }, [data, openCourse]);

useEffect를 사용해서 리렌더링이 발생할 때마다 메모 내용도 같이 가져오도록 구현했다. 이 방법으로 해결이 된 걸 보면 내가 추측한 가설이 어느 정도는 맞았으나 여전히 이해되지 않는 부분이 있다.

      placeholder={
        item.memo ? item.memo : "일정에 대한 메모나 리뷰를 적어보세요!"
      }

문제가 된 코드가 이 부분인데 똑같이 item으로 받아오는 장소명, 주소, 번호의 내용은 그대로 유지되는데 어째서 메모만 초기화 되는 걸까? 그 중에서도 왜 마지막 메모는 초기화 되지 않고 유지되는 걸까?