How to asynchronously fetch data in the "created" hook?

Question

Vue.js

Hello everyone, please tell me how to get the data correctly?
Let's go in order, This is a function in methods iterates over my array for a match in Json,
Also in methods and Axios request, but I call it in created ( see below )

toggleIcon: function() {
for(var key in this.icon) {
if (this.icon[key].id.slice(0,2) == this.value_icon) {
this.icon[key].value = true ;
}
}
}

Everything would be fine, but on the debugger I tracked that the this.value_icon variable is empty, tried SetTImeOut , but did not give any results. can I just call the function in another hook?

created() {
this.getPosition();
this.measureSystemC();
this.measureSystemF();
this.toggleIcon(); // no access to variable with json
},

Answer 1

Created supports async. You can add code like this (await can be specified, only for a method with a promise)

async created() {
   await this.getPosition();
   await this.measureSystemC();
   await this.measureSystemF();
   this.toggleIcon();
},

Working example - https://codesandbox.io/s/xrpw40y7vp