Как получить данные из выбранных строк и столбцов? Таблица данных Vuetify - PullRequest
Новая
       9

Как получить данные из выбранных строк и столбцов? Таблица данных Vuetify

0 голосов
/ 20 января 2020

Мне нужно получить выбранные данные из таблицы. Пример того, что мне нужно, вы можете увидеть здесь https://codepen.io/mihaufs/pen/QWwJEox?editors=1000 Я хочу экспортировать выбранные данные в Excel. Посмотрите мой код. 

<template>
<div>
  <v-data-table
  v-model="selected"
      :headers="headers"
      :items="items"
      :search="search"
      no-data-text=""
    :single-select="singleSelect"
    show-select
    class="elevation-1"
item-key="id"
    >

      <template v-slot:items="props">
        <tr  @click="showAlert(props.item)">
<!-- <v-switch v-model="singleSelect" label="Single select" class="pa-3"></v-switch> -->

        <td class="text-xs-left"  >{{ props.item.id }}</td>
        <td class="text-xs-left">{{ props.item.name}}</td>
         </tr>
      </template>
    </v-data-table>
</div>
</template>



<script>
export default {
  data() {
    return {
      singleSelect: false,
      selected: [],
      // users: "",
      loading: true,
      search: "",
      headers: [
        { text: "Id", value: "id" },
        { text: "name", value: "name" }
      ],
      items: []
    };
  },
  mounted() {
    this.getTransactions();
    console.log(this.singleSelect);
    console.log(this.selected);
  },
  methods: {
    getTransactions() {
      // this.loading = true
      axios
        .get("https://enigmatic-gorge-35647.herokuapp.com/api/TEST"
        })
        .then(response => {
          // console.log(response.data)
          this.items = response.data;
          this.loading = false;
        })
        .catch(error => {
          this.loading = true;
        });
    },
    showAlert(a){
     //I DONT KNOW WHY NOT TRIGGER ME THIS FUNCTION
      if (event.target.classList.contains('btn__content')) return;
      alert('Alert! \n' + a.name);
    }
  }
};
</script>

В данный момент мне нужно другое поле выбора для столбца? Как это сделать? и как получить эти выбранные данные? Мне просто нужно это в console.log после того, как я делаю то, что мне нужно

...