Ghost element doesn't move with the speed of the pointer on mobile

[yanko-belov]

Hello! :wave:

I have a problem with the speed of the ghost element on mobile.

Code:

<draggable
    v-model="slot.slot_component_configurations"
    class="fill-width"
    handle=".draggable-handler"
    v-bind="{
        animation: 200,
        group: `group-${sI}`,
    }"
    @change="changeHandler"
>
    <transition-group>
        <component-configuration
            v-for="(componentConfiguration, cI) in slot.slot_component_configurations"
            :component-configuration="componentConfiguration"
            :advanced-mode="advancedModeMixin"
            :key="componentConfiguration.uuid"
            @change-name="componentConfiguration.name = $event"
            @delete="deleteComponent(sI, cI)"
            @input="handleInput(sI, cI, $event)"
        />
    </transition-group>
</draggable>

The result on mobile (this is the actual problem):

As you can see the ghost element is way slower than the actual movement of the pointer.

---

The result on desktop (this is how I want it to work also on mobile):

Does anyone know how to fix this?

[phantomlsh]

Same here. Really want a solution

[joel-loycom]

Experiencing the same issue... any clue of the root issue or a workaround you found?

[mehmoona-bb]

@belov91 did you find the solution? Having the same issue.

[yanko-belov]

@mehmoona-bb I haven't found a solution.

[Ssoon-m]

@yanko-belov I also had a similar issue and found that there is a bug when there is a transition-duration option in the style of a sub-element in the <transition-group>. After removing the style, I confirmed that it was working properly.