Discussion on: Draggable table row with VueJS, Vuetify and SortableJS

[Alvaro Cánepa]

Great! this is what I was looking for...
Many thanks!

This is my implementation with dynamic columns:

<v-data-table
      :headers="headers"
      :items="arItems"
      :loading="loading"
      item-key="id"
      :show-select="false"
      :disable-pagination="true"
      :hide-default-footer="true"
    >
      <template #body="data">
        <draggable v-model="arItems" tag="tbody" @end="onReorder">
          <tr
            v-for="(item, index) in data.items"
            :key="`row.${index}`"
          >
            <template v-for="(col, idx) in data.headers">
              <td :key="`col.${index}.${idx}`">
                  <action-buttons
                    :path="path"
                    :item-id="item.id"
                    hide-view
                    @delete="deleteItem"
                    v-if="col.value == 'actions'"
                  />
                  <span v-else>{{ $_.get(item, col.value) }}</span>
              </td>
            </template>
          </tr>
        </draggable>
      </template>
    </v-data-table>

[Giangola]

I have to Login to say thanks <3