vuetify on row expand retrieve data

modzor13 answered on June 19, 2020 Popularity 7/10 Helpfulness 4/10

answer vuetify on row expand retrieve data

vuetify on row expand retrieve data

Comment

  <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]
        })
    }
  }

Popularity 7/10 Helpfulness 4/10 Language whatever

Source: stackoverflow.com

Tags: expand row whatever

Link to this answer
Share Copy Link

Contributed on Jun 19 2020

modzor13

0 Answers Avg Quality 2/10

vuetify on row expand retrieve data

Contents

More Related Answers

vuetify on row expand retrieve data

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.