hilongjw / vue-lazyload

A Vue.js plugin for lazyload your Image or Component in your application.
http://hilongjw.github.io/vue-lazyload/
MIT License
7.99k stars 865 forks source link

Loading image not showing #477

Open BASSAMBOFS opened 2 years ago

BASSAMBOFS commented 2 years ago

Hello World!

The Loading image is not showing, any suggestions please ??

#vue-lazyload.js

 import Vue from 'vue';
 import VueLazyload from 'vue-lazyload';

 import loadingImg from '../assets/img/loading/loading.png';

 Vue.use(VueLazyload, {
 preLoad: 1.3,
 loading: loadingImg,
 attempt: 1,
 });

#nuxt.config.js

plugins: [
    ...
    { src: '~/plugins/vue-lazyload', ssr: false },
 ]

#template:

<template>
    <a :href="image.url" class="fx fx-center-center">
      <img
        v-show="showImg"
        v-lazy="imgSrc"
        :src="imgSrc"
        :alt="image.name"
        :title="image.name"
      />
    </a>
</template>
akylc commented 2 years ago

同样遇到这个问题, 但是经过排查发现是因为v-lazy指令被覆盖导致, 我的项目中引用了vant-lazyload 与 vue-lazyload配置冲突了, 导致vant-lazyload 配置覆盖了vue-lazyload, 希望这个对你有帮助.