uniapp app版本更新提示弹窗以及弹窗逻辑

uniapp yekong 217℃

uniapp app版本更新提示弹窗以及弹窗逻辑

<template>
	<view>
		<u-popup :show="show" mode='center' @close="close">
			<view class="upgradeswin">
				<div class="title1">升级提示</div>
				<div class="title3 mt30">升级内容</div>
				<div class="title2 mt30">{{upgrades}}</div>
				<div class="lijishengji mt30" @click="openURL">立即升级</div>
				<div @click="doNotUpgrade" class="zanbushiji mt30">暂不升级</div>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		getVersion,
		upgrade,
		Updateaddress
	} from '@/config/api.js'
	import {
		myCache,
		getVersions
	} from '@/utils/utils.js'

	export default {
		data() {
			return {
				show: false,
				upgrades: '',
				version: '',
				urls: ''
			}
		},
		mounted() {
			var that = this
			that.getVersion()
			that.upgrade()
		},
		methods: {
			close() {
				this.show = false
			},
			openURL() {
				console.log(this.urls)
				// #ifdef APP-PLUS
				plus.runtime.openURL(this.urls)
				// #endif
				// #ifdef H5
				window.open(this.urls)
				// #endif
			},
			doNotUpgrade() {
				this.show = false
				// 缓存接口返回的版本号,用以后期判断是否再次显示升级
				myCache('version', this.version) //版本号 存入缓存,最后一个参数是缓存过期时间
			},
			getVersion: function(res) {
				var that = this
				console.log('Versions')
				getVersion({}).then(res => {
					console.log(res)
					if (res.code == 1) {
						that.version = res.data
						that.compareVersionNumber()
					} else {

					}
				}).catch(err => {

				})

			},
			// 对比版本号
			compareVersionNumber() {
				// 判断是否有缓存
				let cachedata = myCache('version')
				// 判断缓存的版本号和最新从接口获取的版本号是否相同
				if (!cachedata || cachedata != this.version) {
					console.log('没有缓存版本号,或者缓存的版本号和接口返回的版本号不一致')
					console.log(cachedata)
					console.log(this.version)
					this.getcompareVersionNumber2()
				}
			},
			getcompareVersionNumber2() {
				var that = this;
				console.log('对比当前实际版本号和接口版本号是否一直用以判断是否需要升级')
				console.log('当前实际版本号' + plus.runtime.version)
				console.log('接口返回的版本号' + this.version)
				if (getVersions(plus.runtime.version, this.version)) {
					that.show = true
					that.getUpdateurl()
				}
			},
			getUpdateurl: function(res) {
				var that = this
				Updateaddress({}).then(res => {
					console.log(res)
					if (res.code == 1) {
						that.urls = res.data.andriod
					}
				}).catch(err => {

				})
			},
			// 获取更新内容
			upgrade: function(res) {
				var that = this
				upgrade({}).then(res => {
					if (res.code == 1) {
						that.upgrades = res.data
					} else {

					}
				}).catch(err => {

				})

			},
		}
	}
</script>


<style lang="scss" scoped>
	.upgradeswin {
		width: 630rpx;
		padding: 30rpx;
	}

	.lijishengji {
		height: 90rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: nowrap;
		flex-direction: row;
		border: 1rpx solid #FDCA30;
		background: #FDCA30;
		color: #3A3A3A;
		font-size: 28rpx;

	}

	.title1 {
		font-size: 44rpx;
	}

	.zanbushiji {
		height: 90rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: nowrap;
		flex-direction: row;
		border: 1rpx solid #DEDEDE;
		color: #3A3A3A;
		font-size: 28rpx;
	}

	.mt30 {
		margin-top: 30rpx;
	}
</style>

缓存方法

uniapp 设置缓存时间


function myCache(key, value, seconds = 3600 * 24) {
	let nowTime = Date.parse(new Date()) / 1000;
	if (key && value) {
		let expire = nowTime + Number(seconds);
		uni.setStorageSync(key, JSON.stringify(value) + '|' + expire)
		console.log('已经把' + key + '存入缓存,过期时间为' + expire)
	} else if (key && !value) {
		let val = uni.getStorageSync(key);
		if (val) {
			// 缓存存在,判断是否过期
			let temp = val.split('|')
			if (!temp[1] || temp[1] <= nowTime) {
				uni.removeStorageSync(key)
				console.log(key + '缓存已失效')
				return '';
			} else {
				return JSON.parse(temp[0]);
			}
		}
	}

}

版本号对比

版本号对比方法

function getVersions(curV, reqV) {
	var arr1 = curV.toString().split('.');
	var arr2 = reqV.toString().split('.');
	//将两个版本号拆成数字
	var minL = Math.min(arr1.length, arr2.length);
	var pos = 0; //当前比较位
	var diff = 0; //当前为位比较是否相等
	var flag = false;
	//逐个比较如果当前位相等则继续比较下一位
	while (pos < minL) {
		diff = parseInt(arr1[pos]) - parseInt(arr2[pos]);
		if (diff == 0) {
			pos++;
			continue;
		} else if (diff > 0) {
			flag = true;
			break;
		} else {
			flag = false;
			break;
		}
	}
	console.log(flag)
	return flag;
}
喜欢 (0)