微信小程序更新提醒uniapp
简介
在小程序开发中,版本更新至关重要。为确保用户始终使用最新版本,我们建议在每次打开小程序时进行版本检测。具体方案如下:
1. 启动时版本检测:
- 我们使用
uni-app
提供的APIuni.getUpdateManager()
,API返回全局唯一的版本更新管理器对象: updateManager,用于管理小程序更新。
2. 新版本提示与更新:
- 如果检测到新版本,弹出提示框告知用户有新版本可用。
- 提供“立即更新”选项。
- 用户选择“立即更新”后,小程序自动下载更新内容。
3. 重启应用新版本:
- 更新完成后,提示用户确认重启小程序以应用新版本。
![]() |
![]() |
---|---|
摘要 :
实现步骤
1 创建更新方法
App.vue
创建updateApp方法用于检查小程序是否有新版本。
<script setup lang="ts"> import { onLaunch } from '@dcloudio/uni-app' import { useAppStore } from './stores/app' import { useUserStore } from './stores/user' const appStore = useAppStore() const { getUser } = useUserStore() // #ifdef MP-WEIXIN const updateApp = () => { const updateManager = uni.getUpdateManager(); updateManager.onCheckForUpdate(function (res) { // 请求完新版本信息的回调 console.log(res.hasUpdate); }); updateManager.onUpdateReady(function (res) { uni.showModal({ title: '更新提示', content: '新版本已经准备好,是否重启应用?', success(res) { if (res.confirm) { // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启 updateManager.applyUpdate(); } else if (res.cancel) { console.log('用户点击取消,不更新'); } } }); }); updateManager.onUpdateFailed(function (res) { // 新的版本下载失败 uni.showModal({ title: '已经有新版本了哟~', content: '新版本已经上线啦~,请您删除当前小程序,重新搜索打开哟~', }) }); } // #endif onLaunch(async () => { await appStore.getConfig() // #ifdef MP-WEIXIN updateApp() // #endif await getUser() }) </script> <style lang="scss"> // </style>
AI 代码解读
2 测试
添加编译模式,选择编译设置,选择成功状态进行模拟。