[React/Error] 드래그 앤 드랍 시 에러 Cannot find droppable entry with id []

Invariant failed: Cannot find droppable entry with id []
=> id가 있는 드롭 가능한 항목을 찾을 수 없다는 에러.

id [] 안의 값은 <Droppable droppableId="">에 작성한 값에 해당한다.

 

위 에러는 React 18 버전을 사용할 때 드래그 앤 드랍 사용 시 발생하는 에러이다.

 

 

해결방법

index.js 파일에서 <React.StrictMode>를 삭제하면 된다.

아래와 같이 <React.StrictMode>를 지운다.

 

 

참고) React의 StrictMode

 - 애플리케이션 내의 잠재적인 문제를 알아내기 위한 도구로, Fragment와 같이 UI를 렌더링하지 않으며, 자손들에 대한 부가적인 검사와 경고를 활성화한다.

 - 개발 모드에서만 활성화되므로 프로덕트 빌드에는 영향을 끼치지 않는다.

출처: https://ko.legacy.reactjs.org/docs/strict-mode.html

Strict 모드 – React