首先在下載
npm i vue-lazyload --save-dev
然後在main.js 入口文件中配置引入
import VueLazyLoad from 'vue-lazyload'
然後配置默認加載圖片
Vue.use(VueLazyLoad, {
loading: require('./images/default.png') // 加載的默認圖片路徑
})
最後在.vue 文件中使用v-lazy 代替 :src 綁定圖片 例:
<img width="57" height="57" v-lazy="food.icon" alt="">