'react-beautiful-dnd - Invariant failed: Cannot find droppable entry with id

I was following along with a react-beautiful-dnd tutorial that uses react component classes instead of hooks. I was writing an equivalent program with modern react syntax when I came across this error. Invariant failed: Cannot find droppable entry with id [column-1]. I was trying to dynamically update a variable that stores the origin column index to prevent the user from dragging a task to an earlier column. The error occurred when I attempted to use a useState hook inside of an onDragStart function. I have created a codeSandbox showing the problem and would be very thankful for any help.

reactjslistdrag-and-dropmultiple-columnsreact-beautiful-dnd


Solution 1:[1]

Try removing React's strict mode.

Solution 2:[2]

just remove React.strictMode tag on your index.jsx/index.tsx file

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Rizwan Liaqat
Solution 2 Jonathan Mwaniki

Related Questions