I'm currently working on hitting a rest api to retrieve a dataset for a specific piece of equipment. However, I'm struggling to extract the first column of data as an array. I've attempted using computed and methods in vue, but I constantly receive an empty array []. Can anyone shed some light on what might be going wrong? The {{datas}} tag prints out my JSON without any issues, but when I add {{getDate}}, it returns "can't find date of undefined."
Thank you
<template>
<v-app>
<p>{{ datas }}</p>
{{ getDates }}
<center>
<chart :options="chartOptionsBar"></chart>
</center>
<chart :options="chartOptionsLine"></chart>
<p>108J View</p>
</v-app>
</template>
<script>
import axios from "axios";
export default {
name: "E108J",
components: {},
data() {
return {
datas: [],
chartDates: [],
chartOptionsLine: {
// Chart options
},
chartOptionsBar: {
// Bar chart options
}
};
},
mounted() {
axios
.get("http://localhost:3000/E108J")
.then(response => (this.datas = response.data));
},
computed: {
getDates() {
let chartdates;
for (let i = 0;i< this.datas.length; i++) {
chartdates = this.data[i];
}
return chartdates;
}
}
};
</script>
JSON Data:
[
{
// Sample JSON data
},
{
...
}
]