search

anish2690 / vue-draggable-next

Vue 3 drag-and-drop component
https://vue-draggable-next.vercel.app
MIT License
508 stars 45 forks source link

Duplicates during sorts #60

Open Brand3000 opened 11 months ago

Brand3000 commented 11 months ago

Hello! I use Laravel Nova with the outl1ne/nova-sortable package for having the ability to sort items. When I try to drag an item down, it duplicates. Actually, this problem was noticed by several developers. Look this issue please.

I dug into the core and realised that there's an issue especially with vue-draggable-next.

If the keys like so:

service-resource-items-0
service-resource-items-1
service-resource-items-2
...

everything works fine

However, if the keys like so:

service-resource-items-0-1
service-resource-items-1-2
service-resource-items-2-3
...

the issue happens.

A piece of the source code:

<draggable
        tag="tbody"
        v-model="fakeResources"
        draggable="tr"
        @update="updateOrder"
      >
        <ResourceTableRow
          v-for="(resource, index) in fakeResources"
          :key="`${resourceName}-items-${index}-${resource.id.value}`"
        />
 </draggable>

If I delete the "-${resource.id.value}" part from the :key attribute, sorting works fine.

anish2690 commented 10 months ago

@Brand3000 can you please provide reproduction repo ?

Brand3000 commented 10 months ago

@Brand3000 can you please provide reproduction repo ?

Look into this thread please https://github.com/outl1ne/nova-sortable/issues/192