VUE之图片懒加载(vue-lazyload)

本文详细介绍如何在Vue项目中引入并使用vue-lazyload插件实现图片懒加载功能。从声明依赖到安装及配置使用步骤,再到组件内部的具体应用方式,文章提供了完整的实践指南。

1)声明依赖
package.json=>

"vue-lazyload":'1.0.3'

2)安装依赖

npm install

3)使用组件
main.js=>

import VuelazyLoad from 'vue-lazyload';
Vue.use(VuelzayLoad,{require(图片路径)})

4)组建中使用

<img src='图片路径' v-lazy='图片渲染的数据'/>
(本来是<img src='图片路径' :src='图片渲染的数据')
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值