Утро!
Я пытаюсь использовать опору 'single-select' в таблице данных Vuetify, но я столкнулся с проблемой, которую я не знаю, если это проблема.
Прямо сейчас я использую шаблон для тела таблицы:
<v-data-table :headers="headers" :items="proveedoresByString"
:single-select="singleSelect" show-select v-model="itemSelected">
<template v-slot:body="{ items }">
<tbody>
<tr v-for="item in items" :key="item.id">
<!--<td><v-checkbox v-model="itemSelected" :value="item"></v-checkbox></td>-->
<td class="text-xs-center">{{ item.code }}</td>
<td class="text-xs-center">{{ item.name }}</td>
<td class="text-xs-center">{{ item.movil }}</td>
<td class="text-xs-center">{{ item.phone }}</td>
<td class="text-xs-center">{{ item.email }}</td>
<td class="text-xs-center" v-if="!item.emailList"
v-on="on">{{ item.accesoApp === '0' ? 'No' : 'Yes('+ item.appAccess + ')' }}</td>
<v-tooltip max-width="320px" bottom v-if="item.emailList">
<template v-slot:activator="{ on }">
<td class="text-xs-center" v-on="on">{{ item.appAccess === '0' ? 'No' : 'Si ('+ item.accesoApp + ')' }}</td>
</template>
<span>{{ item.emailList }}</span>
</v-tooltip>
</tr>
</tbody>
</template>
</v-data-table>
Прямо здесь, проп не работает, и кусок кода, который содержит элемент v-checkbox не работает как отдельный селектор, он выбирает каждую строку, по которой вы щелкаете.
Так что, если кто-то может помочь заставить работать единственную опцию выбора, это было бы замечательно или подсказка о том, как сделать так, чтобы флажок работал как один селектор тоже подойдет.
Спасибо!
РЕДАКТИРОВАТЬ: Часть скрипта:
<script>
import { mapActions } from 'vuex'
import rulesMixin from '../../generic/rules'
export default {
mixins: [rulesMixin],
data () {
return {
singleSelect: true,
itemSelected: [],
headers: [
{ text: this.$t('m_codigo'), value: 'code', sortable: true, align: 'left' },
{ text: this.$t('m_nombre'), value: 'name', sortable: true, align: 'left' },
{ text: this.$t('m_movil'), value: 'movil', sortable: true, align: 'left' },
{ text: this.$t('m_telefono'), value: 'phone', sortable: true, align: 'left' },
{ text: this.$t('m_email'), value: 'email', align: 'left' },
{ text: this.$t('m_acceso_app'), value: 'accesoApp', align: 'left' }
]
}
}
</script>