yypkg 工具函数 SourceLoader 资源加载器 - 文章教程

yypkg 工具函数 SourceLoader 资源加载器

发布于 2021-09-14 字数 2048 浏览 836 评论 0

资源加载器,常用于资源预加载,支持的资源有:css、js、img(jpg、jpeg、png、gif、webp、mbp)、svga

使用

import SourceLoader from 'yypkg/source-loader'
const resources = ['./demo.css', './demo.js']
const loader = new SourceLoader({
  url: resources,
  retry: 3,
})
loader.start()
loader.$on('process', (total, count, url) => {
  console.log(total, count, url)
})
loader.$on('complete', (total) => {
  console.log('total', total)
})
loader.$on('error', (url) => {
  console.error('加载失败', url)
})

配置项

参数名 描述 类型 默认值
url 需要加载的资源url String 或 Array ''
retry 加载失败时的重试次数 Number 3
autoStart 是否在实例化时自动执行start() Boolean false

方法

方法名 描述 参数
start 开始触发资源加载
$on 事件监听方法 eventName: 事件名称,String,见下表
callback: 回调函数

事件

事件名 描述 回调函数参数
process 资源加载过程中 total:资源总数
count:当前加载资源的索引值
url:当前加载资源的url
complete 资源加载完毕(无论加载失败还是成功) total:资源总数
error 资源加载失败(retry不触发) url:加载失败的资源url

如果你对这篇文章有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

支持 Markdown 语法,需要帮助?

目前还没有任何评论,快来抢沙发吧!

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

2414 文章
28 评论
64851 人气
更多

推荐作者

qq_81h7fk

文章 0 评论 0

Aik

文章 0 评论 0

爱上歆随懿恫

文章 0 评论 0

qq_rvKjBH

文章 0 评论 0