LazyLoad图片懒加载

npm install vue-lazyload -s

在main.js 引入

import VueLazyLoad from 'vue-lazyload';
Vue.use(VueScroller， {
  error:'./static/error.png',
  loading:'./static/loading.png', // 其他属性定义方式雷同
});//定义自己想要的

组件中使用

<img class="img-lazy" v-lazy="url">//url是图片地址

API参数选项说明API

参数	描述	默认值	数据类型
preLoad	预加载高度比例	1.3	Number
error	当加载图片失败的时候	'data-src'	String
loading	当加载图片成功的时候	'data-src'	String
attempt	尝试计数	3	Number
listenEvents	想要监听的事件	['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove']	Desired Listen Events
adapter	动态修改元素属性	{ }	Element Adapter
filter	图片监听或过滤器	{ }	Image listener filter
lazyComponent	lazyload component	false	Lazy Component
dispatchEvent	触发dom事件	false	Boolean
throttleWait	throttle wait	200	Number
observer	use IntersectionObserver	false	Boolean
observerOptions	IntersectionObserver options	{ rootMargin: '0px', threshold: 0.1 }	IntersectionObserver

 

vue-lazyload  https://www.npmjs.com/package/vue-lazyload（翻译不准，参考文献API）