uniapp 移动端app判断用户app版本是否是最新版(Android)

1.在uniapp项目中的App.vue文件下

javascript 复制代码
<script>
	import { ref } from 'vue';
	const token = ref();
	export default {
		onLaunch: function() {
			// #ifdef APP
			//获取打包时设置的版本号,然后存到storage里
			plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) => {
				uni.setStorage({
					key: 'VersionCode',
					data: wgtinfo.versionCode
				})
			})
			// #endif
		},
		onShow: function() {
			// console.log('App Show')
		},
		onHide: function() {
			// console.log('App Hide')
		},
	}
</script>

<style lang="scss">
	@import "@/uni_modules/uview-plus/index.scss";

	html,
	body {
		overflow: hidden;
		overscroll-behavior: none;
	}
</style>
  1. 具体实现代码
javascript 复制代码
<template>
<view class="firm" v-show="showbaifenbi">
			已下载:
			<progress :percent="baifenbi" show-info stroke-width="3" />
		</view>
		<view class="fullScreenMask" v-if="ifFullScreenMask">
			<view class="kuang">
				<view class="tit">
					温馨提示
				</view>
				<view class="al_tit">
					当前版本不是最新版本,请前往应用商店下载!
				</view>
			</view>
		</view>

</template>
// 显示下载进度
let showbaifenbi = ref(false);
let baifenbi : any = ref(0);
let ifFullScreenMask = ref(false)

onLoad(() => {
		uni.getSystemInfo({
			success: function (resInfo : any) {
				userEquipment.value = resInfo.osName
				uni.getStorage({
					key: 'VersionCode',
					success: async (resData) => {
						// 获取最新版本的app
						let res = await proxy.$http(
							"app_version/getAppVersionByNew",
						);
						let urlData = Url.value + res.data.url;
						if (Number(res.data.version_code) > Number(resData.data)) {
							if (userEquipment.value == 'android') {
								ifFullScreenMask.value = false
								// 方法一 :直接调取打开浏览器
								// plus.runtime.openURL(urlData)
								// 方法二 : 提示用户
								uni.showModal({
									title: '提示',
									content: '当前版本不是最新版本,点击下载',
									showCancel: false,
									success: function (res : any) {
										plus.nativeUI.showWaiting(`正在下载...`);
										showbaifenbi.value = true
										var dtask = plus.downloader.createDownload(
											urlData,
											{
												method: "GET"
											}, (d, status) => {
												console.log(d);
												if (status == 200) {
													plus.runtime.install(d.filename)
												} else {
													plus.nativeUI.alert("安装失败,请稍候重试: " + status)
												}
											});
										//监听下载
										dtask.addEventListener("statechanged", listenStatechanged)
										dtask.start();
									}
								});
							} else {
								ifFullScreenMask.value = true
								return
							}
						} else {
							uni.showToast({
								title: '当前已经是最新版本',
								icon: 'none',
								position: 'bottom'
							});
							return
						}
					}
				})
			}
		});

	})
	/* 监听下载进度 */
	function listenStatechanged(task : any) {
		let num : any = parseInt(task.downloadedSize) / parseInt(task.totalSize) * 100
		baifenbi.value = parseInt(num)
		if (num == 100) {
			showbaifenbi.value = false
			plus.nativeUI.closeWaiting();
			uni.showModal({
				title: '提示',
				content: '下载完成,请安装新版本',
				showCancel: false,
				success: () => {
					plus.runtime.quit();
				}
			})
		}
	}

ios的话自行给提示 去应用商店下载

相关推荐
黄毛火烧雪下19 小时前
React Native (RN)项目在web、Android和IOS上运行
android·前端·react native
fruge19 小时前
前端正则表达式实战合集:表单验证与字符串处理高频场景
前端·正则表达式
baozj19 小时前
🚀 手动改 500 个文件?不存在的!我用 AST 撸了个 Vue 国际化神器
前端·javascript·vue.js
用户40993225021219 小时前
为什么Vue 3的计算属性能解决模板臃肿、性能优化和双向同步三大痛点?
前端·ai编程·trae
海云前端120 小时前
Vue首屏加速秘籍 组件按需加载真能省一半时间
前端
蛋仔聊测试20 小时前
Playwright 中route 方法模拟测试数据(Mocking)详解
前端·python·测试
零号机20 小时前
使用TRAE 30分钟极速开发一款划词中英互译浏览器插件
前端·人工智能
molly cheung20 小时前
FetchAPI 请求流式数据 基本用法
javascript·fetch·请求取消·流式·流式数据·流式请求取消
疯狂踩坑人20 小时前
结合400行mini-react代码,图文解说React原理
前端·react.js·面试
Mintopia20 小时前
🚀 共绩算力:3分钟拥有自己的文生图AI服务-容器化部署 StableDiffusion1.5-WebUI 应用
前端·人工智能·aigc