异步请求swiper图片无法显示 vuex

文章讲述了在Vue项目中使用Vuex存储异步请求的数据,遇到Swiper图片显示不正常的问题。问题在于数据请求与Swiper初始化的时机不匹配。解决方案是利用回调函数,在数据成功获取后初始化Swiper,确保轮播插件能正确展示所有图片。
摘要由CSDN通过智能技术生成

异步请求swiper图片无法显示 vuex

问题描述:
vue项目中使用vuex存储请求数据,数据图片已请求到,但是使用swiper时仅一张图片,且无法自动换图片,且无报错。

我说我内心告诉自己莫慌莫慌,办法总比困难多;(QvQ)
实在太困了就趴下歇一歇,吃个桃子去~~~

分析:
数据有,组件正常,那么就是数据请求时机与插件使用时机的问题。数据时异步请求,那么插件应该在数据请求后使用。
(默默看了眼我做静态时候放在mounted了,所以联调时候会只有一张图
Q_Q ~~~)

解决方案:
使用回调函数,在数据获取后再new Swiper() 方法使用轮播插件;如图:
调取函数执行是在vuex里接口请求完数据且状态码200通了的情况下!
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值