Search code examples
reactjsdrag-and-dropdnd-kit

@dnd-kit/sortable : Prevent link from activating when dragged item is dropped

My sortable item contains a link so when I click on it to drag and drop. Problem is after I drop, it navigates to the link. How can I prevent this?

Solution

  • You can get isDragging from

    const { isDragging } = useDraggable({ id });

    or

    const { isDragging } = useSortable({ id });

    and then

    <a href={!isDragging ? 'link' : undefined}>...</a>