How can i keep draggable in it's original list while dnd action in progress? E.g. i want to drag item "copy" and hold it's original where it was at the same time. After onDragEnd
i can copy data, but while dragging it looks wrong and can confuse users. (Did not find example in official list)
Solved by rendering additional list item copy (with transformation turned off) down in list.
This sample code from docs
<Draggable ...> {(provided, snapshot) => ( <MyItemDraggable .../> )} </Draggable>
Become something like this
<Draggable ...> {(provided, snapshot) => ( <> <MyItemDraggable .../> {snapshot.isDragging ? <MyItemDraggable className={`dnd-copy`} .../> : null} </>)} </Draggable>
Note new fake draging-time item with dnd-copy class
.dnd-copy ~ div {
transform: none !important;
}
Empty tags are also needed for this solution
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With