I'm currently working on my first Vue.js application and I'm facing an issue with the initial data upload in the script. After modifying the data received from a database call, I encounter an error during the page's initial load which resolves itself after a few seconds. I attempted to use setTimeout to delay the function execution but it resulted in an error within the Vue.js framework. How can I correctly implement this setTimeout?
Below is a snippet of my script:
<script>
export default {
data () {
return {
step: 1,
selected: 1
}
},
components: {
},
computed:{
selectedBasket() {
return !this.$store.getters.basket ? null : this.$store.getters.basket
},
items(){
return !this.$store.getters.items ? null : this.$store.getters.items
},
filteredEstimation(){
this.$store.getters.estimations.map(function(estimation) {
estimation.offers.map(function(offer) {
offer.name = offer.name.split(" ").reverse().slice(1).reverse().join(" ");
if (offer.name.includes("first")) {
offer.description = "first option";
}
if (offer.name.includes("second")) {
offer.description = "second option";
}
if (offer.name.includes("third")) {
offer.description = "third option";
}
});
});
return !this.$store.getters.estimations ? null : this.$store.getters.estimations.filter( item => item.id == this.selected )[0].offers
},
setTimeout(() => {}, 700); // This line should be revised
},
methods: {
getItemsName(item) {
if(item === 1){
return 'bag';
} else if(item === 2){
return 'paper';
} else {
return 'pen';
}
}
}
};
</script>