一、需求说明
- 目前出现情况：每次发布新版本，如果用户正在使用小程序，都需要让用户将小程序销毁再重新启动，才能使用最新版本的代码
- 希望当小程序版本更新后，用户打开小程序时自动检查是否有新版本，若有，则提示用户是否更新
二、需求实现
2.1 冷启动和热启动
用户打开小程序时有两种启动方式：
- 冷启动：若用户首次打开，或小程序销毁后被再次打开，此时需要重新加载，会检查当前最新版本的代码，并运行。
- 热启动：如果用户已经打开过小程序，且在一定时间内再次打开，此时小程序并未被销毁，并不会检查最新代码。
2.2 热启动时实现版本更新
使用微信官方提供的 api 来检查并更新版本： 一般会将代码写在 app.js 的 onLaunch 函数中，在打开小程序时就执行
App({
onLaunch() {
// 判断是否能用这个 api
if (wx.canIUse('getUpdateManager')) {
// 创建 updateManager 实例
const updateManager = wx.getUpdateManager()
// 检查是否有新版本
updateManager.onCheckForUpdate(function(res) {
// hasUpdate 指是否有新版本，为 boolean 值
if (res.hasUpdate) {
updateManager.onUpdateReady(function() {
wx.showModal({
title: '更新提示',
content: '新版本已经准备好，是否重启应用？',
success: function(res) {
if (res.confirm) {
// 强制更新版本
updateManager.applyUpdate()
}
}
})
}),
updateManager.onUpdateFailed(function() {
wx.showModal({
title: '已经有新版本了',
content: '新版本已经上线啦~，请您删除当前小程序，重新搜索打开'
})
})
}
})
} else {
wx.showModal({
title: '提示',
content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
})
}
}
})
附上用到的几个 api 说明：
-
UpdateManager.onCheckForUpdate()
-
UpdateManager.onUpdateReady()
-
UpdateManager.applyUpdate()
<关于我们>
我们是来自帝都的一枚前端程序猿 + 一枚前端程序媛。
这里发布的文章是我们对学习内容的总结，预计会每周至少会更新一篇。
目前我们学习计划是： 小程序实战 => vue 进阶用法 => vue 原理 => css 基础 => es6 => js 深入
另外，工作中用到的一些技术和完成的功能，我们也会及时总结更新在这里
如文章有错误或表述不清晰，欢迎各位留言反馈~~
