vuetify v-data-table get row index code example

Example 1: vuetify on row expand retrieve data

<v-data-table
    :headers="headers"
    :items="items"
    show-expand
    single-expand
    item-key="name"
    :search="search"
    @item-expanded="loadDetails">
    <template v-slot:expanded-item="{ headers, item }">
        <td :colspan="headers.length">
           <table v-for="(sample, index) in items.samples" :key="index">
            <tr>
              <th>Sample Acc</th>
              <td>{{ sample.sample_accession }}</td>
            </tr>
           </table>
        </td>
    </template>
  </v-data-table>

  methods: {
    loadDetails({item}) {
        axios.get('http.../' + item.id)
            .then(response => {
              item.samples = response.data[0]
        })
    }
  }

Example 2: how to use in vuetify v-data-table

<template v-slot:item="{ item }">
  <tr :class="{active: group && item.id == group.id}">
    <td>{{ item.name }}</td>
    <td>{{ item.grade }}</td>
  </tr>
</template>