vue-lazyload - 이미지 지연 로딩 예제 튜토리얼

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
})

Options

매개변수 설명

preLoad

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　틀오버 사진은 실패한 후 로드되어야 합니다.

　 예: 오류: 'dist/error .png',

loading

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 신랑 앞으로-ure- 이미지 설정에서 켜세요\

　　　설명: 청취된 이벤트, 기본값 ['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove']

　　 예: ListenEvents: [ 'scroll' ]

adapter

　　Description:

　　Example:

filter

　　Description: 이미지 필터링 경로, 기본값 {}

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

어댑터

실제 사례

 在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 중국어 웹사이트의 기타 관련 기사를 참조하세요!