بنده میخوام زمانی که کاربر محصولی رو به سبد خرید اضافه میکنه از طریق لاراول و vue و axios یک لودینیگی نمایش داده بشه این رو چطوری میتونم پیاده سازی کنم؟ زمانش رو چطوری تعیین کنم که تا زمانی این لودینگ نمایش داده بشه که اطلاعات رو به سرور ارسال میکنه و پاسخ رو از سرور دریافت میکنه ؟؟
یک روشش اینه شما یک متغییر ایجاد کنی و false بذاری وقبل درخواست axios این متغییر رو true کنی و تگ لودینگ رو هم جای که میخوای میذاری و با v- show نمایش بدین و پس از درخواستت اون متغییر false میکنی
new Vue({
data: {
loading: false
},
mounted () {
//loading TRUE
this.loading = true;
// axios
axios.get('/URL').then(response => {
this.info = response.data
})
.catch(error => {
})
.finally(() => this.loading = false )
}
})
<i v-show="loading" class="fa fa-spinner fa-spin"></i>
روش های دیگه هم هست
https://www.digitalocean.com/community/tutorials/add-loading-indicators-to-your-vuejs-application
درخواست هایی که با Axios میفرستید Promise-based هستند
پس به متدهای then و finally دسترسی دارید
قبل از ارسال درخواست» Loading: false
در حین انجام درخواست» Loading: true
پس از دریافت درخواست» Loading: false
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟