项目使用vue3+ts
const progressNum = ref(0); // 下载进度
// 提前下载文件资源
const requestFun = (url: string, name: string) => {
let xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(null);
xhr.addEventListener(
'progress',
function (evt) {
let number = Number((evt.loaded / 1870373).toFixed(2)) * 100;
progressNum.value = Math.ceil(number);
},
false,
);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
let result = xhr.response;
}
}
};
};
//预加载图片
const downloadResource = () => {
// 需要预加载的图片路径存放在数组里
var imgsrc = [img1, img2, img3, img4, img5, img6, img7, img8, img9]; // 图片地址
//初始化image对象
//遍历数组的路径，预加载到客户端
for (var i = 0; i < imgsrc.length; i++) {
var img = new Image();
img.src = imgsrc[i];
}
};