粘贴时<div>ASD</div>
发生错误:error: The template root requires exactly one element
<template>
<div>ASD</div>
<v-card>
<v-tabs background-color="indigo" center-active dark>
<v-tab v-bind:key="1" v-bind:href="'#clients'">Список клиентов</v-tab>
<v-tab v-bind:key="2" v-bind:href="'#transactions'">История транзакций</v-tab>
<v-tab-item v-bind:key="1" v-bind:value="'clients'">
<v-data-table v-bind:headers="clients.headers" v-bind:items="clients.items"></v-data-table>
</v-tab-item>
<v-tab-item v-bind:key="2" v-bind:value="'transactions'">
<v-data-table v-bind:headers="transactions.headers" v-bind:items="transactions.items"></v-data-table>
</v-tab-item>
</v-tabs>
</v-card>
</template>
<script>
export default {
data: () => ({
clients: {
headers: [{
text: 'ID',
value: 'id'
}, {
text: 'Наименование',
value: 'title'
}, {
text: 'Рекламный бюджет',
value: 'amount'
}, {
text: 'Дата создания',
value: 'created_at'
}],
items: [{
id: 3,
title: 'Test Name 3',
amount: '10000 RUB',
created_at: '3 дня назад'
}, {
id: 2,
title: 'Test Name 2',
amount: '9900 RUB',
created_at: '5 дней назад'
}, {
id: 1,
title: 'Test Name 1',
amount: '17500 RUB',
created_at: '2 месяца назад'
}]
},
transactions: {
headers: [{
text: 'ID',
value: 'id'
}, {
text: 'Сумма',
value: 'amount'
}, {
text: 'Зачислено',
value: 'converted_amount'
}, {
text: 'Комментарий',
value: 'comment'
}, {
text: 'Дата транзакции',
value: 'created_at'
}],
items: [{
id: 3,
amount: '10000 KZT',
converted_amount: '2600 RUB',
comment: 'Пополнение рекламного бюджета для клиента: Test Name 3',
created_at: '3 дня назад'
}, {
id: 2,
amount: '100 USD',
converted_amount: '6900 RUB',
comment: 'Пополнение рекламного бюджета для клиента: Test Name 2',
created_at: '5 дней назад'
}, {
id: 1,
amount: '5000 RUB',
converted_amount: '5000 RUB',
comment: 'Пополнение рекламного бюджета для клиента: Test Name 1',
created_at: '2 месяца назад'
}]
}
})
}
</script>
Vue 应该只有一个根元素。错误直接告诉你这一点。例如,将所有内容包装在标签
div
中