vue.draggable.next icon indicating copy to clipboard operation
vue.draggable.next copied to clipboard

transition-group breaks oldIndex and newIndex in end handler

Open jangxx opened this issue 2 years ago • 1 comments

I have a draggable element like this

<draggable
	v-if="currentAvatarData !== null"
	:list="currentAvatarControlsSorted"
	tag="transition-group"
	:animation="200"
	item-key="id"
	handle=".handle"
	@start="handleDragStart"
	@end="handleDragEnd"
>

with a start and end handler which take care of the actual ordering by using the oldIndex and newIndex values from the drag event. The value for list is a computed value that can not be mutated. This works great without the transition group, but as soon as I set tag to "transition-group", the indices become very weird. In a list with 6 items I saw indices like 17 and 13 for example.

My question is now if this is a bug or if I'm doing something wrong and this is intentional behavior.

jangxx avatar Jan 07 '23 18:01 jangxx

There is a completely undefined behavior with transition groups, I have updated all the dependencies of the repo and it's reflected in the tests, the vnodes in transition group in vue 3 do not have an el for some reason, making the context undefined and the index calculation completely random

Tofandel avatar Jul 27 '23 17:07 Tofandel