Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to get the item of a v-data-table row?

I have a v-data-table (-virtual, which shouldn’t matter) and I want to call a method with the item (user in users array) at the row I clicked.

<v-data-table-virtual
  v-model="selectedToDelete"
  :headers="headers"
  :items="users"
  :key="users"
  @click:row="editUser()"
/>

Is there any way to do it (best without using the item slot)?


(I am using Vuetify 3.3.15)

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

The click:row event gives Event, { item: DataTableItem } for the handlers. So you an implement your handler like the following to get the item and perform specific action with any of the item properties.

handleRowClick(e, { item }) {
  console.log(item)
  // call any method here
},

See demo

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading