uniapp 微信小程序打开相册后会触发onshow

最新推荐文章于 2025-06-06 15:07:11 发布
原创 最新推荐文章于 2025-06-06 15:07:11 发布 · 582 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#uni-app

记录一个微信小程序uniapp生命周期引发的bug

因为我不知道使用uni.chooseImage 会触发onShow导致数据莫名其妙回显旧数据

找了大半天才发现自己是为什么，所以打好基本功太重要了，在此记录这个bug以此提醒自己。

uniapp中千万注意有一些情况会触发onshow:

当前页调用：uni.chooseMedia

类似的还有：

  1. uni.chooseImage：从本地相册选择图片或使用相机拍照。
  2. uni.chooseVideo：拍摄视频或从手机相册中选视频。
  3. uni.scanCode：调起客户端扫码界面进行扫码。
  4. uni.chooseMedia：选择图片或视频。

原理：页面显示/切入前台时触发

所以下次记录这个需要注意的细节！！！

uniapp开发中需要注意的问题：onShow和onHide生命周期重复触发的问题
代码简单说 Vue、JAVA、PHP、Node.js 熟练运用，接口、架构、性能全搞定。
03-06 514
onShow和onHide事件是 uniapp 中非常重要的生命周期事件，理解它们的触发时机能够帮助我们更好地处理页面状态、优化性能和防止错误。通过合理使用这些事件，我们能够让应用在页面切换时更为流畅高效。
uniapp 微信小程序 - 调起手机摄像头: 拍摄身份证的正反面，自定义身份证取景框，在相机上绘制 “身份证轮廓“ 与提示文字（超详细示例源码，一键复制运行开箱即用）
高级前端工程师
05-05 9187
uniapp微信小程序拍摄身份证专用相机，uniapp小程序如何在相机上增加图片和文字，uniapp微信小程序怎么给调起的相机加入自定义图片，unapp小程序实现给相机上面铺上身份证正反面轮廓，uniapp微信小程序自定义相机的取景框示例，uni-app实现小程序身份证取景框，uniapp小程序平台给相机加上身份证辅助线的轮廓，uniapp小程序实现身份证取景框拍摄，uniapp微信小程序自定义相机 ，给相机添加辅助框，解决拒绝相机默认授权后无法再次拉起相机授权问题，uni-app自定义摄像头拍照添加人物框
uniapp微信小程序开发踩坑日记：onShow的应用场景及用法
lbcbjtlhmjq的博客
02-17 6256
由于微信小程序是单页应用程序，所以用户在打开小程序后，只有第一次进入页面时会加载页面，之后再通过导航栏切换到相同的页面并不会导致页面重新加载但是在某些场景下，我们希望每次用户一回到某个页面，就执行相应的函数，但因为导航栏切换页面并不会导致页面重新加载，所以页面中的代码不会被再次执行如果大家和我一样使用vue3开发，可能会想到使用vue3的生命周期函数onMounted，但同样地，导航栏切换页面也不会导致dom元素重新渲染，所以onMounted并不会执行。
uniapp点击图片预览，关闭预览图片后自动触发onshow生命周期，怎么解决？
maliao5的博客
08-08 1645
我为何要点击图片预览，禁止触发onshow里面的this.postlist()，是因为预览图片关闭，不设置变量figh为false，会触发this.postlist()事件，观看的位置会回到顶部，非常影响用户体验。此时，点击别的页面，在回到当前页面，onshow里面的this.postlist()也不触发了，怎么还让onshow里面的this.postlist()触发，我原本想着，预览之后，点击关闭预览的事件做处理，再关闭后，将变量figh为true， 发现这个关闭是用户操作的，没有事件可绑定。
UniApp 超详细生命周期和报错音效实现教程
m0_74331272的博客
12-31 1170
onLoad：在页面初始化时触发，仅触发一次。比如从其他页面打开该页面时。onShow：在页面每次显示时触发。比如从后台返回到该页面，或者从其他页面切回来。
【uni】预览previewImage，上传图片触发onShow生命周期，解决方法（ispreviewImage）
AAAXiaoApple的博客
03-23 4164
目前项目适用的逻辑是，提交 form表单 触发 onshow ，，编辑保存表单 不触发 onshow，
uniapp预览图片后会触发页面的onShow生命周期，解决这个问题
qq_42444651的博客
05-06 3176
我遇到的问题是使用uni.previewImage(）API预览图片后，关闭图片会触发onShow生命周期，而我的onShow生命周期是有函数调用的，如果预览图片后直接调用onShow生命周期，会出现逻辑错误。 可以在data中设置一个变量showOrNot = true 在调用预览图片的函数中把该变量设置成false， 而在onShow生命周期中用一下判断 if(this.showOrNot){ 自己要调用的函数 } ...
关于uni.previewImage一直触发onShow
最新发布
m178398家里有只小肥猫
06-06 222
点击预览图片的时候 一直 触发 onShow。想到一种方法 类似于小锁。
uni-app的onShow 事件意外触发
weixin_42776027的博客
08-02 1923
当你返回到该页面时，框架认为这是一个页面从后台到前台的切换，因此会触发。函数中打印一些日志，查看其被触发的具体条件和上下文，从而更好地理解为何它会被多次触发，并采取相应的措施来避免不必要的操作。的触发可能与微信小程序的生命周期管理有关。在某些情况下，如从一个子页面返回到带有 tabBar 的页面时，可能会出现。此外，根据之前的信息，某些情况下在iOS设备上，尤其是在从一个子页面返回到 tabBar 页面时，：如果页面已经被创建并且处于后台状态（例如，用户浏览了其他页面或应用），当用户再次回到此页面时，
【uni-app 微信小程序】新版本发布上线，用户本地版本更新问题总结
YuShiYue的博客
01-09 2000
如果当前线上小程序没有这些更新代码，则需要下下次发版用户才有可能看到新版本已经准备好，是否重启应用？的这些提示（下次发版用户本地小程序就会有更新的代码，下下次发版用户小程序就可以触发了更新最新版了），经测试ios用户感觉都会静默更新，不会出现弹框提示。以上只是我自己的理解，我感觉微信的这个更新就是一个黑盒，我们按照操作来就行了，剩下的交给微信，相信相信的力量，如果这样都更新不成功，那就等着用户联系客服吧😄。
uniapp - [微信小程序] 实现点击预览各种文件 pdf文档、视频mp4、mp3音乐、图片图像、word/excel/ppt 等，uniapp小程序文件预览功能（详细示例代码，一键复制开箱即用）
高级前端工程师
11-18 7908
uniapp，uniapp微信小程序,支付宝小程序平台端，uniapp实现文件在线预览，uniapp微信小程序怎么实现预览视频mp4,mp3音乐,图片,office文档，小程序平台如何在线预览word/excel/ppt文档，uniapp实现小程序端的文件查看功能，uniapp小程序端实现pdf文件预览，uniapp纯前端预览PDF、DOC、DOCX、图片、视频，uni-app文档、图片预览查看，uniapp文档预览功能，uniapp小程序端文件预览，uniapp小程序平台纯前端解析word,pdf,xls
解决uniapp小程序下载全部图片的问题
able_me的博客
07-23 1632
解决uniapp小程序下载全部图片的问题 代码如下： 遇到特殊情况： 如果遇到小程序预览时只有开启调试功能才能下载图片，说明你的服务器图片地址有误，要和后端人员确认下载接口的域名地址是否与下载图片的接口是否对应， 希望能帮到大家。 插入html代码片 <template> <view> <!-- 限时推广页面 --> <view class="TimeLimit_Box"> <view class="TimeLimit_card"&gt
微信小程序教程
m0_69450653的博客
10-07 1212
小程序知识点总结
微信小程序解决wx.chooseMedia出发onShow方法
m0_71349739的博客
12-09 1836
当点击上传照片调用 wx.chooseMedia的方法时，会调用到当前页面的onShow，onHide等方法，这个时候就可以定义一个全局的变量isSwitch开关，触发上传图片之前setData一下isSwitch改为true然后在onShow方法中判断isSwitch为true则return．。
uniapp uni.previewImage 点击预览 会出现数据堆叠
cjy_fly的博客
05-13 1071
原因:uni.previewImage 执行完会触发onShow(这个钩子函数) // html <view class="cu-bar bg-white"> <view class="action"> 图片描述 </view> <view class="action"> <!-- {{imgList.length}}/4 --> </view> </view> <view class.
解决微信小程序调用相机引起页面刷新
qq_46032261的博客
03-09 2550
微信小程序调用相机引起页面刷新
微信小程序scancode返回会触发onshow
weixin_43120876的博客
09-01 2301
var _this = this uni.scanCode({ success: function(res) { console.log(res.result) } }); 当扫码之后返回页面 会调用页面的onshow 当我们的页面是列表页（可分页） 当我们在列表页的onshow 需要做刷新操作的时候并且扫码是对列表页单个数据的查询 扫码之后在回到页面 会导致接口刷新两次 就会导致查询的指定数据和页面onshow 刷新的数据在一起 解决办法： 1、在会对列表影响的操作页面，例如：修改页面 修改完
解决UniApp子组件使用`onShow`、`onPullDownRefresh`、`onReachBottom`导致接口重复触发的优化方案
代码简单说 Vue、JAVA、PHP、Node.js 熟练运用，接口、架构、性能全搞定。
12-09 537
条件渲染的子组件中时，会有一个潜在的问题：由于闭包的存在，当子组件的状态来回切换时，这些函数可能会重复触发，导致接口重复请求、内存泄漏，甚至可能引发假死现象。每当组件卸载时，回调函数会被清空，从而避免不必要的资源浪费和接口重复请求。如果你也在使用UniApp，遇到了类似的问题，不妨参考这种方式来优化你的代码，确保应用的性能和稳定性。生命周期中重置回调函数逻辑，确保在子组件销毁时能正确卸载回调，避免因闭包导致的问题。，并在组件卸载时移除回调函数，避免内存泄漏和重复触发的问题。在开发UniApp应用时，
微信小程序部分api 会触发 onShow onHide
qq_45219069的博客
02-29 2768
解决部分api触发小程序 onShow onHide 首先要明白 微信小程序的 onShow（） onHide（）分为页面级的和应用级的，应用级的就是app.js里面的那几个，页面级的就是pages里的 当使用了下列api时，均会触发页面级和应用级的onShow onHide 点击右上角小圆点关闭小程序。 图片预览：wx.previewImage 拨打电话：wx.makePhoneCall 存入...
uniapp 微信小程序 页面加载完触发事件
01-25
在 UniApp 中开发微信小程序页面时，你可以通过监听特定生命周期钩子函数来触发某些操作。当页面完成加载后，最常用的钩子是 `onLoad` 和 `onReady`。 - **`onLoad()`**：此回调会在页面开始加载时调用，可以在此处获取传递过来的参数等初始化工作。 - **`onReady()`**：该方法将在页面首次渲染完成后被调用一次。这意味着 DOM 已经构建完毕，并且此时所有组件都已准备就绪。所以如果你需要对视图层做些修改或读取数据并显示出来，应该放在这个阶段之后进行处理。 此外还有其他一些重要的生命周期函数如： - **`onShow()`**：每次打开新页面都会先走一遍 onLoad -> onReady ，而从其他地方返回当前页面则会经过 onHide->onShow 过程； - **`onHide()`**: 当切换到后台或其他页面隐藏本页面的时候触发； 对于大多数情况来说，在页面内容完全呈现给用户之前想要执行的操作都可以放到 `onReady` 函数里去实现。 例如下面是一个简单的例子： ```javascript export default { // 页面初次加载 onLoad(option) { console.log('Page loaded'); }, // 页面初次渲染完成 onReady() { console.log("The page has fully rendered"); // 可以在这里添加你希望在页面加载结束后执行的动作 } } ```
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值