1분 미리듣기 구현

Debug

1분 미리듣기 구현은 하였는데, 미쳐 확인하지 못한 버그가 있었다.
비 로그인 상태에서 음원을 재생하여 1분 미리듣기를 진행하는중 로그인을 하였을 때 setInterval이 계속 동작하는것이다.

이와 같은 상황에서 setInterval에 로그인 상태를 console.log 해보니 로그인이 되어있음에도 false로 인식되었다.

한마디로 setInterval이 취소되지 않는것이었다.

login상태가 바뀔때 setInterval을 취소시키도록 useEffect의 의존성 배열에 login 상태를 넣어주고 clearInterval을 실행시켰다.

여기서 문제가 또 발생힜는데 setInterval을 변수에 담았기에 리 렌더링 되었을때 이 변수가 초기화 되서 접근이 불가능하다는것이다.

여러 시도끝에 setInterval을 담은 변수를 state에도 지정시켜주고, 초기값은 null로 지정되게 해서 리렌더링 되었을때 없어지도록 하였다.

왜 이게 되는지는 정확하게 알지 못하였다.
프로젝트를 모두 마치고 리펙토링 하면서 이는 다시 손봐야겠다.