打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
vue使用vue-lazyload实现图片懒加载
  1. 安装 vue-lazyload

    npm install vue-lazyload--save

  2. main.js 中

    import VueLazyLoad from 'vue-lazyload'
    Vue.use(VueLazyLoad, {
      // 使用本地placeholder图片
      // loading: require('assets/img/common/placeholder.png')
      // 使用fakeimg在线生成的图片,可修改参数生成自己需要的
      loading: 'https://fakeimg.pl/320x420/?text=wait&font=lobster'
    })

  3. 使用v-lazy替换src标签中的src属性

    <img :src="showImage" alt="">
    改成
    <img v-lazy="showImage" alt="">

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
使用vue-lazyload实现图片懒加载
vue -lazyload图片懒加载
成功vue一个页面引用另个页面
图片加载延迟(jquery应用) - Open Source Photos | Other...
图片延迟加载插件Jquery LazyLoad
lazyload简单用法
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服