I am facing an issue with API data in my Vue js project. The page loads quickly but the data from the API takes more than 5 seconds to load. Strangely, the API response appears very fast in the console.
I have implemented the API in a separate file called API services and created a class that contains all my APIs called BuildingService. However, when I call the API on mounted, it loads slowly.
Can anyone provide assistance with this?
<script>
import Vue from 'vue'
import BuildingsService from "@/services/ApiService"
Vue.use(VueClipboard)
export default {
data(){
return{
buildings:[],
}
},
name: 'icons',
components: {
BaseHeader
},
mounted:function(){
BuildingsService.getBuildings().then((response) => {
this.buildings = response.data.response;
console.log(response.data.response,"dd");
});
}
};
</script>
<b-col lg="3" md="6" v-for="(building, index) in buildings"
:key="index" >
>{{building.building_number}}
</b-col>