[Uniapp]带进度提示下载、加载弹窗（官方组件）

前言：

前段时间写了一个Uniapp疑难杂症的文章，发现确实帮到了一些朋友，一直想把这些东西继续下去，奈何一直在赶进度，没有时间去写这些东西，因为这个项目前后两端从设计到制作都是我一个人做，公司也没有其他程序员，所以说实话个人认为对这方面（Uniapp、Vue、H5、JS）的进步还是很大的，没写CSS是因为我们应用是动态生成，所以几乎所有的style都是变化的，原本我想让外包公司承接，结果一找人问报价都太离谱，最后找到一个行业里面10年经验的大佬，他说这个东西所有东西都是变化的，不是一般前端搞的东西，你要找经验丰富的架构了，好家伙，我一听这不行啊，毕竟我是个人转包不走公司，我找个架构我工资都不够给他开钱的，算了，硬着头皮上吧，大不了换个公司又是一条好汉（笑cry），结果没想到还真让我写成了，接下来一段时间就开始优（mo）化（yu）了，也就有时间给大家分享一些内容，不过我还是觉得个人前端知识还是不充足的，没办法和业内专业的老师们比较，写一些大佬们看不起的东西，帮帮小白这样，毕竟新人刚上来是很懵的，这个怎么没效果，还TM不报错，都是这么走来的。

---

框架：Uniapp

IDE：HBuilder 3.8.4 | Visual Studio Code 1.78.2（主要）

日期：2023/6/16 周五

---

API：plus.downloader

(为明晰直接使用，搬来一部分解释，需要了解官方案例的自己点过去看）

方法：

createDownload	新建下载任务
enumerate	枚举下载任务
clear	清除下载任务
startAll	开始所有下载任务

对象：

Download	Download对象管理一个下载任务
DownloadEvent	下载任务事件类型
DownloadState	下载任务状态
DownloadOptions	下载任务参数

回调方法：

DownloadCompletedCallback	下载任务完成时的回调
DownloadStateChangedCallback	下载任务状态变化回调
DownloadEnumerateCallback	枚举下载任务回调

---

let dtask = plus.downloader.createDownload(url,{
			retry:2,
			retryInterval:1,
			method:"GET",
			filename:"_doc/" + projectName,
			timeout:5,
			},function(d,status){
			if(status == 200){
				//自己设计逻辑操作
				log.logMessage('下载请求状态： ' + status);
				
			}else{
				log.logError("下载失败！状态码："+status + "原因是："+ d);
				
			}
		});

		dtask.start();

		var prg = 0;//进度数字化
		var show= plus.nativeUI.showWaiting("下载中");
		dtask.addEventListener('statechanged',function(task,status){
			log.logMessage("下载开始，任务：" + task);
			log.logMessage("下载状态：" + status);
			switch(task.state){//根据下载状态调整其显示内容
				case 1:
					showLoading.setTitle("正在下载……");
					break;
				case 2:
					showLoading.setTitle("连接到服务器");
					break;
				case 3:
					prg = parseInt((parseFloat(task.downloadedSize) / parseFloat(task.totalSize)) * 100);
					showLoading.setTitle("正在下载：" + prg + "%");
					break;
				case 4:
					plus.nativeUI.closeWaiting();
					uni.reLaunch({ url: '/pages/index/index' })//这里我下载完需要刷新界面，可以自行调整
					break;
			}
		});