Vue項目中獲取數據后使用swiper輪播，無法輪播且 autoplay 和 loop 失效問題！

問題表現：輪播組件顯示第一張圖，可拖動但無法切換到下一張圖。但是F12控制臺切換屏幕后能正常輪播但無法loop循環。

問題關鍵：輪播數據是發起請求后傳入swiper組件的，數據還沒獲取完全，而swiper組件已經開始初始化了

所以需要等待請求完成后再初始化輪播！
解決辦法：v-if 來控制輪播組件是否初始化,項目是3張圖輪播，這里通過判斷數據數組長度是否為3來控制。

<mySwiper :swiper="homeBanners" v-if="homeBanners.length === 3"></mySwiper>

總結

以上是生活随笔為你收集整理的Vue项目中获取数据后使用swiper轮播，无法轮播且 autoplay 和 loop 失效问题！的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。