简体   繁体   中英

Vuetify, how to get row by double click event in v-data-table

I need to get row by event but it only give me event and undefeated, how to catch items in v-data-table

<v-data-table
          :headers="showHeaders"
          :page="page"
          :pageCount="numberOfPages"
          :options.sync="options"
          :loading="loading"
          :server-items-length="totalItems"
          :items="items"
          :items-per-page="15"
          class="mainTable"
          @dblclick:row="editItem(item, $event )"
          :footer-props="{
      showFirstLastPage: true,
      firstIcon: 'mdi-arrow-collapse-left',
      lastIcon: 'mdi-arrow-collapse-right',
      prevIcon: 'mdi-minus',
      nextIcon: 'mdi-plus'
    }"

---method---

    editItem (item, e) {
  console.log(item)
  this.editedIndex = this.items.indexOf(item)
  this.editedItem = Object.assign({}, item)
  this.dialog = true
},

what i've got

only event but if i will transmits item it will be undefeated

No need to mention the parameters in the template:

@dblclick:row="editItem"

Note that the first parameter is the event and the second one is the row with following properties:

 {
  expand: (value: boolean) => void,
  headers: DataTableHeader[],
  isExpanded: boolean,
  isMobile: boolean,
  isSelected: boolean,
  item: any,
  select: (value: boolean) => void
}

the correct method:

editItem (event, {item}) {
  console.log(item)
  this.editedIndex = this.items.indexOf(item)
  this.editedItem = Object.assign({}, item)
  this.dialog = true
},

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM