Делаю запрос на сервер с помощью axios в проекте vue.js. Получаю данные с сервера и пытаюсь их оформить в таблицу. Для начала пробую положить в одну колонку инфу о count, который равен 1 (для проверки). Таблица выводится пустая. Вставляю JSON локально в файл vue, то все работает. Вопрос в чем моя ошибка и как правильней сделать? Как положит инфу в разные ячейки, если портянка json будет длиннее, через сортировку js?
Получаю следующие данные:
{
"data": {
"status": 0,
"response": [
{
"id": "1",
"owner": "l",
"status": "NEW",
"cfg": {
"count": 1,
"accept": [
"false"
],
"amount": {
"currency": "R",
"min": 1,
"max": "10"
},
"sender": {
"bank": {
"Agt": {
"type": "Ot",
"value": "5555",
"name": [
"вязь"
],
"currency": "R",
"addr": {
"country": "RU"
}
},
"Acct": {
"type": "Ot",
"value": "331"
},
"AgtAcct": {
"type": "Ot",
"value": "301"
}
},
"client": {
"name": [
"Рог"
],
"Acct": {
"type": "Ot",
"value": "331"
}
}
},
"recipient": {
"bank": {
"Agt": {
"type": "Othr",
"value": "04",
"name": [
"вязь"
],
"currency": "R",
"addr": {
"country": "RU"
}
},
"Acct": {
"type": "Ot",
"value": "331"
},
"AgtAcct": {
"type": "Ot",
"value": "301"
}
},
"client": {
"name": [
"Cor"
],
"Acct": {
"type": "Ot",
"value": "331"
}
}
}
}
Форма vuetify таблицы:
<template>
<div>
<v-data-table
:headers="headers"
:items="arrayGetGroup"
:items-per-page="5"
sort-by="calories"
class="elevation-1"
>
<template v-slot:top>
<v-toolbar app color="primary" dark>
<v-toolbar-title>Тест</v-toolbar-title>
<v-divider
class="mx-4"
inset
vertical
></v-divider>
<v-spacer></v-spacer>
</v-toolbar>
</template>
</v-data-table>
</div>
</template>
Скрипт следующий
<script>
import axios from 'axios'
export default {
data: () => ({
value: [],
arrayGetGroup:[],
headers: [
{
text: 'Номер',
align: 'left',
value: 'number',
},
{ text: 'Сюда', value: 'arrayGetGroup.data.response[0].count' },
{ text: 'ММ', value: '' },
{ text: 'Ак', value: '' },
],
}),
mounted() {
axios.post(cURL,
{
request_type: configuration,
request: GetGroup
})
.then(response => (this.arrayGetGroup = response))
.catch(error => console.log(error))
},
}
</script>