图片加载本地服务起不消耗带宽
图片优化–图片懒加载vue-lazyload
详细功能链接: https://www.npmjs.com/package/vue-lazyload
下载:npm i vue-lazyload -S
简单用法:
main.js
//main.js文件
import VueLazyload from 'vue-lazyload'
Vue.use(VueLazyload)
// or with options
//svg不失真
Vue.use(VueLazyload, {
preLoad: 1.3,
error: '没有图片时的要显示的图片(/imgs/error.svg)',
loading: '加载图片(/imgs/loading.svg)',
attempt: 1
})
//组件dom使用
<li v-for="img in list">
<img v-lazy="img.src" >
</li>