usage
import Vue from 'vue'
import VueLazyload from 'vue-lazyload'
Vue.use(VueLazyload, {
preLoad: 1.3,
error: 'dist/error.png',
loading: 'dist/loading.gif',
attempt: 1
})参数说明
preLoad
描述：
例子：
error
立即学习“前端免费学习笔记（深入）”；
描述：图片加载失败后，的默认图片
例子：error: 'dist/error.png',
loading
描述：图片加载过程中，默认显示的图片设置
例子： loading: 'dist/loading.gif',
attempt
描述：
例子：
listenEvents
描述：监听的事件，默认值 ['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove']
例子：listenEvents: [ 'scroll' ]
adapter
描述：
例子：
filter
描述：过滤图片的路径，默认{ }
例子：
lazyComponent
描述：
例子：
在main.js文件添加：
import VueLazyload from 'vue-lazyload'
Vue.use(VueLazyload, {
// 设置默认显示的图片
loading: require('common/image/default.png')
})
在需要用到延迟加载页面
<img width="60" height="60" v-lazy="item.imgurl">以上就是vue-lazyload - 图片延迟加载实例教程的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
546
