I'm trying to code an algorithm that for each data table retrieves the last data per column deposited in the table and sends it to an array. Then I want to display it on my application like this
So first I create my objects that compose my table for each data table:
data () {
return {
tag_id: ['bts_d02c2b7d9098aaa2', 'bts_c077ffaa9098aaa2', 'bts_85zty3'],
dessert:[];
},
methods:{
CreateTable(){
for(let i = 0; i < this.tag_id.length; i++){
this.desserts.push(
{
name: this.tag_id[i],
tension: 0,
courant: 0,
temperature: 0,
},
)
}
},
}
here it works.
Then, in a for loop I want that for each object of my table I fetch the last data and send it in the object that corresponds to it in the table:
getDatafor(){
for(let i = 0; i < this.desserts.length; i++){
this.val_ia = i;
this.getAllData();
}
},
async getAllData() {
console.log('val_ia is ' + this.val_ia)
const tag_id_name = encodeURIComponent(this.tag_id[this.val_ia]);
const url = this.$api.getRESTApiUri() + `/all/last_id/${tag_id_name}`;
return fetch(url)
.then(res => res.text())
.then((result) => {
const data = JSON.parse(result);
console.log("datasend")
this.desserts[this.val_ia].tension = data[0].adc_v/100
this.desserts[this.val_ia].courant = data[0].adc_i;
this.desserts[this.val_ia].temperature = data[0].temperature/100;
})
.catch((error) => {
console.log(error)
});
},
Only with this code the data are sent only when i == datasets.length-1. (imax)
Functions are called like this :
mounted(){
this.CreateTable();
setInterval(this.getDatafor, 4000)
},
with consoles.log it does this:
I want it to be this :
val_ia is 0
datasend
val_ia is 1
datasend
val_ia is 2
datasend
I don't understand why the data are not sent each time we pass in the getAllData() function in a logical way