·设为首页收藏本站📧邮箱修改🎁免费下载专区💎积分✅卡密📒收藏夹👽聊天室
返回列表 发布新帖

Vue实现图片预加载

197 0
发表于 2022-6-29 16:26:57 | 查看全部 阅读模式

马上注册,免费下载更多dz插件网资源。

您需要 登录 才可以下载或查看,没有账号?立即注册

×
[JavaScript]  
  1. methods: {
  2.     preload: function() {
  3.       let imgs = [
  4.         "static/img/back.gif",
  5.         "static/img/correct.png",
  6.         "static/img/cover.gif",
  7.         "static/img/errExpress.png",
  8.         "static/img/error.png",
  9.         "static/img/ply.png",
  10.         "static/img/q1.png",
  11.         "static/img/q1a.png",
  12.         "static/img/q1b.png",
  13.         "static/img/q1c.png",
  14.         "static/img/q1d.png",
  15.         "static/img/share.png",
  16.         "static/img/start.png",
  17.         "static/img/stop.png"
  18.       ]
  19.       for (let img of imgs) {
  20.         let image = new Image()
  21.         image.src = img
  22.         image.onload = () => {
  23.           this.count++
  24.           // 计算图片加载的百分数,绑定到percent变量
  25.           let percentNum = Math.floor(this.count / 14 * 100)
  26.           this.percent = `${percentNum}%`
  27.         }
  28.       }
  29.     },
  30.   },
复制代码
我要说一句 收起回复

回复

 懒得打字嘛,点击右侧快捷回复【查看最新发布】   【应用商城享更多资源】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

图文热点
创宇盾启航版免费网站防御网站加速服务
投诉/建议联系

discuzaddons@vip.qq.com

未经授权禁止转载,复制和建立镜像,
如有违反,按照公告处理!!!
  • 联系QQ客服
  • 添加微信客服

联系DZ插件网微信客服|最近更新|Archiver|手机版|小黑屋|DZ插件网! ( 鄂ICP备20010621号-1 )|网站地图 知道创宇云防御

您的IP:18.221.27.56,GMT+8, 2024-11-22 13:06 , Processed in 0.235799 second(s), 76 queries , Gzip On, Redis On.

Powered by Discuz! X5.0 Licensed

© 2001-2024 Discuz! Team.

关灯 在本版发帖
扫一扫添加微信客服
QQ客服返回顶部
快速回复 返回顶部 返回列表