当前位置 博文首页 > 缘来侍你的博客：uni-app 版本更新
问题：做版本更新，用自带的提示弹窗太丑，想自己布局，在App.vue中又写不了布局
查了下资料
用纯js实现版本更新提示弹窗
可配置是否强制更新，可看到下载的进度
实现方式：
?
// 弹窗图标url
? ? ? ?const $iconUrl = "./static/images/ic_ar.png";
路径是相对App.vue的路径
?
在文件的开头我引入了一个api的方法getAppVersion
这个方法是请求接口获取版本信息（是否需要更新，若需要，返回新版本的信息）
// 可以用自己项目的请求方法
getAppVersion(req).then(response => {
/* res的数据说明
* | 参数名称 | 一定返回 | 类型 | 描述
* | -------------|--------- | --------- | ------------- |
* | versionCode | y | int | 版本号 |
* | versionName | y | String | 版本名称 |
* | versionInfo | y | String | 版本信息 |
* | forceUpdate | y | boolean | 是否强制更新 |
* | downloadUrl | y | String | 版本下载链接（IOS安装包更新请放跳转store应用商店链接,安卓apk和wgt文件放文件下载链接） |
*/
let res = response.data;
if (res.code === 0) {
callback && callback(res.data);
} else if (isPrompt) {
uni.showToast({
title: "当前已是最新版本",
icon: "none"
});
}
}).catch(err => {
})你也可以不引人api方法，直接把上面的部分换成普通的api请求，只要返回的数据是按上面res数据说明的形式返回就行了（不清楚的欢迎评论联系）
只需修改上面提到的部分，若返回的数据正确即可出现弹窗
3.使用（分进入APP自动更新和手动更新两种方式）
首先在页面中引入上面的js文件
import APPUpdate, { getCurrentNo } from "@/common/js/APPUpdate.js";进入APP自动更新：只需在App.vue的onLaunch中写入如下代码即可
// #ifdef APP-PLUS
APPUpdate();
// #endif手动更新：只需将如下代码放到对应点击事件中即可
// true 没有新版本的时候有提示，默认：false
APPUpdate(true);获取版本号：
// #ifdef APP-PLUS
getCurrentNo(res => {
// 进页面获取当前APP版本号（用于页面显示）
this.version = res.versionName;
});
// #endif用到的文件资源：
具体实现的js
https://download.csdn.net/download/weixin_44052462/13188942
用到的图片
https://download.csdn.net/download/weixin_44052462/13189320
如果接口部分不知道怎么写或有什么问题欢迎评论
cs