[React] TypeError: destroy is not a function

Uncaught TypeError: destroy is not a function

 

잘 돌아가던 페이지에서 에러가 떠서 뭔가 하고 봤는데 TypeError가 발생했다. 리액트 버전 업데이트를 하면서 자잘한 버그가 많이 생긴다. 아마 기존에 해결 안되던 걸 새로 해결해서, 버그로 버티고 있던 구조가 무너지기 때문인 듯하다. (내가 코드를 잘 짜놨다면 이런 일은 없었겠지...)

 

이번에 뜬 에러는 Uncaught TypeError: destroy is not a function 였는데 useEffect 안에서 함수 이외의 것을 return 하거나 async, await를 사용하는 경우에 발생한다고 한다. 나의 경우는 useEffect 안에서 async를 사용해서 발생했다. 제거해주니 이전처럼 잘 돌아갔다.

 

async, await의 경우

 

수정 전

useEffect(async() => {
        await loadItem();
    }, []);

수정 후

useEffect(() => {
        loadItem();
    }, []);

 

참고자료

https://medium.com/geekculture/react-uncaught-typeerror-destroy-is-not-a-function-192738a6e79b

https://stackoverflow.com/questions/74265321/uncaught-typeerror-destroy-is-not-a-function-error-in-react