VueLazyLoad (Vue图片懒加载)组件使用随笔

1. cnpm或者npm安装

　cnpm i  vue-lazyload -S   #安装至develop中 　　或     npm install vue-lazyload --save-dev 2. main.js中引入并配置参数 　比较常用的参数是图片加载错误（error）和预加载时显示的图片（loading） 　import VueLazyLoad from 'vue-lazyload' 　Vue.use(VueLazyLoad, { 　　error: './static/error.png'      　　// 图片路径错误时加载图片 　　loading: './static/loading.png'     //预加载图片 　}) 3.在Vue文件中使用 　将Vue中的img图片绑定 v-bind：src 修改为 v-lazy 　例如:  <img class="demo_img" v-lazy="data.imgUrl">   踩坑： 　　懒加载中 loading  || error 设置不成功的原因 　　//  图片在assets中 　　loading: require('./assets/loading.gif) 　　//  图片在static中 　　loading: '../static/loading.gif'  

标签：loading,Vue,static,VueLazyLoad,error,加载,图片
来源： https://www.cnblogs.com/shirunfeng/p/14668970.html