uniapp在线检查更新,进度条展示

在App.vue中编写以下代码:

<script setup>
import { getLastAppVersionApi } from '@/common/api/app.js'
import { onLaunch } from '@dcloudio/uni-app'
	
onLaunch(async() => {
  const versionRes = await getLastAppVersionApi()
  const lastVersion = versionRes.list[0].appVersion
  const currentVersion = plus.runtime.version
  if(lastVersion != currentVersion) {
    uni.showModal({
      title: '更新提示',
      content: '检测到新版本('+lastVersion+'),是否更新?',
      success: (bool) => {
        if(bool.confirm) {
          downloadPackage()
        }
      }
    })
  }

})

// 创建下载任务
const downloadPackage = () => {
  const task = plus.downloader.createDownload('http://121.196.244.189:33188/pda_cadysun.apk', {}, (res, status) => {
    if(status == 200) {
      plus.runtime.install(res.filename)
    }
  })
  onProgress(task)
}

// 下载进度展示
const onProgress = (task) => {
	try {
		task.start()
		let prg=0
		let showLoading=plus.nativeUI.showWaiting('正在下载')
		task.addEventListener('statechanged', e => {
		 switch(e.state){
			case 1:
				showLoading.setTitle('正在下载');
				break;
			case 2:
				showLoading.setTitle('已连接到服务器');
				break;
			case 3:
				prg=parseInt((parseFloat(e.downloadedSize)/parseFloat(e.totalSize))*100);
				showLoading.setTitle('正在下载'+prg+'%');
				break;
			case 4:
				// 下载完成
				plus.nativeUI.closeWaiting();
				break;
		 }
		})
	} catch(e){
		plus.nativeUI.closeWaiting();
		uni.showToast({
			title: '更新失败',
			icon:'none'
		})
	}
}

</script>
本站涉及到的资料教程资源免费提供,阅读全文即可获取下载地址
注:本站分享及资料仅供个人学习使用,禁止用于其他用途,因用户自身造成一切问题与本站无关!版权归原作者所有,本站不承担技术及版权问题,如有侵犯您的权益请联系我们删除

为您推荐