用了swiper切换图片很大几率不会加载一直在loading

[lyseky]

:key="item" 也加了

[youdianfan]

我的也是

[PandinusImperator]

这个问题无解么

[Erimons-chan]

你可以在swiper里边也加lazyload,我这边是切换后不能滚屏加载了，就第一页可以滚屏加载

[huiXinYiJi]

监听swiper的图片切换事件（图片切换事件可以替换为自己使用的swiper组件提供的事件，此处我用的uniapp swiper组件中的animationfinish事件），

在切换事件里面判断， 当前图片是否是 lazy=loading状态，

如果是loading状态，手动给图片元素添加animationend事件：

可以先判断图片lazy状态，仅在loading状态的时候 添加此事件

<template>
   <img ref="img" v-lazy="imgSrc" :key="imgSrc" />
</template>

<script>
export default {
  methods: {
      triggerLoaded() {
	    const ele = this.$refs.img;
	    if (!ele) return;
	    const lazyAttr = ele.getAttribute('lazy');
	    if (['loaded', 'error'].includes(lazyAttr)) return;
	    if (lazyAttr === 'loading') {
		    let event = new Event('animationend', { bubbles: true, cancelable: false });
		    ele.dispatchEvent(event);
	    }
       }

   }

}
</script>

父组件在合适的swiper监听事件中触发triggerLoaded方法就可以

animationend事件可以替换为lazyload的listenEvents属性中提供的事件['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove']， 我没有试过其他事件，若需要定义其他触发事件，可以尝试修改 new Event的事件名