2021. 7. 14. 14:12ㆍ프론트엔드/React.js
얼마전에 Material-UI를 사용하다가 PopOver를 사용하게 되었는데,
그 뒤로 에러가 떴다.
막줄을 보면 알겠지만, Popover에서 생긴 문제다.
findDOMNode is deprecated 에러란?
우선 이 에러가 무엇인지 알아보자.
이름만 봐도 알 수 있듯, DOM Node를 찾는 함수가 만료(deprecated)되었다고 한다.
여기서 만료 = '더 이상 사용하지 않음'이다.
이 함수는 react-dom 패키지에 있는 함수다.
https://ko.reactjs.org/docs/react-dom.html#finddomnode
ReactDOM – React
A JavaScript library for building user interfaces
ko.reactjs.org
보다시피 Strict 모드에서는 권장되지 않는다고 한다.
왜 에러가 나는건가?
에러가 나는 이유는 간단하다.
1. 내 App이 StrictMode이다. (<StrictMode>로 감싸져있다.)
2. Material-UI 컴포넌트중에 findDOMNode를 사용하는 애들이 있다.
3. 그 컴포넌트를 쓰면 간접적으로 findDOMNode가 호출되면서 에러가 뜬다.
해결 방안은?
material-ui Drawer - findDOMNode is deprecated in StrictMode
I have a simple ReactJS app based on hooks (no classes) using StrictMode. I am using React version 16.13.1 and Material-UI version 4.9.10. In the Appbar I am using Drawer.
stackoverflow.com
네... 그냥 Strict 모드를 끄라고 합니다.
끄는 방법: Index.js에 들어가서 <StrictMode>와 </StrictMode>를 주석처리한다.
'프론트엔드 > React.js' 카테고리의 다른 글
| React.js의 LifeCycle (with Hooks) (0) | 2021.11.23 |
|---|---|
| Tailwind + React.js 세팅하기 (0) | 2021.11.10 |
| React Router URL에 따라 Mount 시키기 (0) | 2021.07.13 |
| React에서 배경을 깔쌈하게 넣어보자 (0) | 2021.07.12 |
| Javascript for 반복문 정리 (0) | 2021.07.09 |