vue-lazyload简单使用
Posted zzxuan
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue-lazyload简单使用相关的知识,希望对你有一定的参考价值。
vue-lazyload简单使用
npm地址:https://www.npmjs.com/package/vue-lazyload
github地址:https://github.com/hilongjw/vue-lazyload
1.安装插件
npm install vue-lazyload --save
2.引用文件,一般在main.js全局引用,且配置好图片
import Vue from ‘vue‘ import App from ‘./App.vue‘ import VueLazyload from ‘vue-lazyload‘ Vue.use(VueLazyload) // or with options Vue.use(VueLazyload, { preLoad: 1.3, error: ‘dist/error.png‘, loading: ‘dist/loading.gif‘, attempt: 1 }) new Vue({ el: ‘body‘, components: { App } })
3. vue文件中将需要懒加载的图片绑定 v-bind:src 修改为 v-lazy
以上是关于vue-lazyload简单使用的主要内容,如果未能解决你的问题,请参考以下文章