Identify drop container when using multiple containers

[jhergeth]

I am trying to use vue-dndrop to implement dragndrop between cells in a data table. Imagin you have 12 boxes (a table with 4 rows an 3 cols) and in each cell you have a number of beans. I want to drag and drop the beans between the cells.

Each bean is a draggable. Each cell is a container (as draggables have to be direct children of a container). So I have a data-table with 12 containers. The containers and the draggables are generated by v-for's so they share the same event code. (Actually the rows of the table a generated by v-data-table and the cells in a row are generated by a v-for).

I managed to identify the pick up cell for the drag using your suggestion:

              <Container
                  :get-child-payload="(idx) => getChildPayload(row_idx, col_idx, idx)"

When trying to do the same to identify the drop cell (container):

              <Container
                  @drop="onDrop(row_idx, col_idx, $event)"
                  :get-child-payload="(idx) => getChildPayload(row_idx, col_idx, idx)"

Within 'onDrop' I only get the coordinates (row_idx and col_idx) of the start of the drag (the source cell) and not of the drop (the destination cell). With that my onDrop-function is unable to drop the dragged item in the correct cell in the data-table..

What am I doing wrong?