uniapp自动检测版本更新并显示下载进度

先附上源码
修改完善后的js代码
优点：可以禁用tabbar导航栏，并且实时显示下载进度
缺点：非可视化进度条显示（感兴趣的可以直接赋值，稍作修改即可）

method:{
// 检测版本更新
			checkVersionToLoadUpdate: function(server_version, curr_version) {
				const that = this

				if (server_version != curr_version) {
					//TODO 此处判断是否为 WIFI连接状态
					uni.showModal({
						title: "版本更新",
						content: '有新的版本发布，检测到您当前为Wifi连接，是否立即进行新版本下载？',
						confirmText: '立即更新',
						cancelText: '稍后进行',
						success: function(res) {
							if (res.confirm) {
								
								//设置 最新版本apk的下载链接
								var downloadApkUrl = that.verison.updatepath;

								var dtask = plus.downloader.createDownload(downloadApkUrl, {},
									function(d, status) {

										// 下载完成  
										if (status == 200) {

											plus.runtime.install(plus.io.convertLocalFileSystemURL(
												d.filename), {}, {}, function(error) {
												uni.showToast({
													title: '安装失败',
													duration: 1500
												});
											})
										} else {
											uni.showToast({
												title: '更新失败',
												duration: 1500
											});
										}
									});
								try {
									dtask.start(); // 开启下载的任务
									var prg = 0;
									var showLoading = plus.nativeUI.showWaiting(
									"正在下载"); //创建一个showWaiting对象 
									dtask.addEventListener('statechanged', function(
										task,
										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();
												//下载完成
												break;
										}
									});
								} catch (err) {
									plus.nativeUI.closeWaiting();
									uni.showToast({
										title: '更新失败-03',
										mask: false,
										duration: 1500
									});
								}

							} else if (res.cancel) {


							}

						}
					});

				}
			}
	}

遇到问题
1，将数据下载和数据总大小放在监听的状态200执行，无法同步更新渲染到页面，当进度条进展到一半的时候就会跳转到安装（附上问题代码块）解决：应该放入监听状态码为3的情况进行数据实时更新
method内问题代码块

function onStateChanged(download, status) {
									
									if (status == 200) {
										const totalSize=download.totalSize
										let nowSize=download.downloadedSize
											that.process=nowSize / totalSize * 100
										if(that.process==100){
											that.$refs.popup_process.close()
										}
									}
									
								}

附上整个问题代码
写在method内部方法

// 检测版本更新

			checkVersionToLoadUpdate: function(server_version, curr_version) {
				const that = this

				if (server_version != curr_version) {
					//TODO 此处判断是否为 WIFI连接状态
					uni.showModal({
						title: "版本更新",
						content: '有新的版本发布，检测到您当前为Wifi连接，是否立即进行新版本下载？',
						confirmText: '立即更新',
						cancelText: '稍后进行',
						success: function(res) {
							if (res.confirm) {
								// uni.showToast({
								// 	icon: "none",
								// 	mask: true,
								// 	title: '有新的版本发布，检测到您目前为Wifi连接，程序已启动自动更新。新版本下载完成后将自动弹出安装程序',
								// 	duration: 5000,
								// });
								that.$refs.popup_process.open()
								//设置 最新版本apk的下载链接
								var downloadApkUrl = that.verison.updatepath;

								var dtask = plus.downloader.createDownload(downloadApkUrl, {},
									function(d, status) {

										// 下载完成  
										if (status == 200) {

											plus.runtime.install(plus.io.convertLocalFileSystemURL(
												d.filename), {}, {}, function(error) {
												uni.showToast({
													title: '安装失败',
													duration: 1500
												});
											})
										} else {
											uni.showToast({
												title: '更新失败',
												duration: 1500
											});
										}
									});

								function onStateChanged(download, status) {
									
									if (status == 200) {
										const totalSize=download.totalSize
										let nowSize=download.downloadedSize
											that.process=nowSize / totalSize * 100
										if(that.process==100){
											that.$refs.popup_process.close()
										}
									}
									
								}
								dtask.addEventListener("statechanged", onStateChanged, false);
								dtask.start();
							} else if (res.cancel) {
								
								
							}

						}
					});

				}
			}

以下为方法调用区域
在onshow内调用的

//版更新调用

this.checkVersionToLoadUpdate(this.verison.num, this.server_version)

以下为初步思路设置一个进度条的html弹框代码（问题：无法禁用tabbar导航）
需要在扩展组件库中安装upop

<!-- 下载更新进度条 -->
		<uni-popup ref="popup_process" @touchmove.stop.prevent="moveHandle" :mask-click="false">
			<view class="process">
				<view class="download">
					正在下载中
				</view>
				<view class="process_box">
					
					<view class="process_inner" :style="{width:process+'%'}">
						
					</view>

				</view>
			</view>
		</uni-popup>

以上仅为个人笔记