解决element轮播图显示问题

534 阅读1分钟

问题:页面加载后,轮播图没有加载出来,要等几秒后才会出现

image.png

思路:

  1. 一开始以为是图片太大了,导致加载慢,后来换了一张比较小的图片,但问题还是那样;
  2. 后来加上了:autoplay="false"这个属性,把自动切换调成false后,轮播图就一直停在空白页面,并没有加载出来,所以确定不是图片大小问题;
  3. 然后在网上搜了下轮播图相关的问题,发现一个问题是这样的:轮播图首次加载时会显示最后一张图片,引起原因是轮播图接收的数组swiperList的初始值是空数组,请求接口后swiperList才被赋值,再重新渲染数据对应的图片。

解决办法就是:组件加一个v-if,当请求接口,赋值数组后,才等于true