endDrag function on component not being called when item is removed from DOM

I’m using react-dnd for a kanban board app (trello like), and when moving a card to another list (thus unmounting source component during drag), the endDrag function is not called, as the listeners for DragDropStore are removed on unmount.

As a workaround, I’ve added a _lastDraggedItem and getLastDraggedItem to DragDropStore, and subscribed to DragDropStore on parent component, handling the endDrag there. As we clear the variables in DragDropStore before firing the DRAG_END event, I couldn’t find any other way to get dragged item.

The reason I’m not using DROP event is, it’s not fired when the item is dropped outside of browser window, only DRAG_END is fired.

It works but it’s messy, breaking the beginDrag & endDrag symmetry.

Are there any other ways to trigger a function on endDrag, with access to dragged item?

Or if is this a valid usecase for others, should we add my workaround to the repo?

[remcotak]

@gaearon I’m having almost the same issue as this one. I have a simple sortable list that gets controlled by Redux. The sorting of the list is done almost the same way as this example.

Except the problem is, items can get removed from that list. The state gets updated with a complete new list retrieved from the store with less items. The unmount of the items happens and the dragEnd is not triggered.

The problem only occurs when a new list is presented with an item missing

[Finec]

Maybe this can help.