当前位置: 首页 > 编程笔记 >

微信小程序开发问题之wx.previewImage

司徒捷
2023-03-14
本文向大家介绍微信小程序开发问题之wx.previewImage,包括了微信小程序开发问题之wx.previewImage的使用技巧和注意事项,需要的朋友参考一下

小知识

wx.previewImage是微信小程序官方提供的预览图片功能的api。

在新页面中全屏预览图片。预览的过程中用户可以进行保存图片、发送给朋友等操作。

那么他有哪些坑呢?

我遇到的问题藏得比较深,我是在使用wxParse解析富文本时发现的。wxParse在解析img时会给它加上点击事件,那么这个点击事件是什么呢?

图在下面:

  

从中可以看到是微信的图片预览功能。其中that.setData({isPreview:true})是我加上去用来判断是否点击了图片,本身是没有的,此时先忽略掉。

首先,点击图片预览时,会终止页面一切正在执行的操作,这是为什么呢?我猜测是触发了页面的onHide函数,我在onHide中打log时果不其然,验证了我是正确的。

当你再次点击图片回去时,会再次触发页面的onShow事件。所以,当你在onHide或者onShow函数里有执行的操作的时候就要注意了,这两个函数都会被触发,所以这时候就需要判断,这两个函数被触发是来源于正常的页面加载隐藏还是来源于点击图片预览,于是便有了我上面在wxParse的源码wxParse.js里的wxParseImgTap里加了一句that.setData({isPreview:true}) ,而后我们可以用isPreview来判断onShow和onHide是否是被预览图片触发的。

此时我们并没有解决页面事件被终止的事实,因为线程被终止了。因为js里是单线程的,预览图片时会向服务器请求图片src,所以此时其他的异步操作便被停止,因为预览图片是一个同步操作,所以当你点击图片时,图片预览优先级最高,其他动作暂停,当你再次点击图片回到原样时,图片预览完成,在开发者工具里会自动继续之前页面被暂停的动作,但是真机调试却不会。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对小牛知识库的支持。

 类似资料:
  • 本文向大家介绍微信小程序开发之IOS和Android兼容的问题,包括了微信小程序开发之IOS和Android兼容的问题的使用技巧和注意事项,需要的朋友参考一下 微信小程序开发之IOS和Android兼容的问题 一、时间转换问题: 这不只是小程序上面的问题是ios系统 都有这个问题 就是new  Date("2017-06-16") 在IOS会出现NAN的情况所以对于时间转换需要另行封装,解决方案如

  • uniapp+vue3开发微信小程序在浏览器打开样式正常,在微信开发工具上打开却错乱,感觉是scss没生效

  • 场景: 我们是一个公司,然后给对面不同公司做对应的小程序, 但是数据不允许放在我们服务器里面,要放到他们服务器里面, 然后这样子的话就得请求他们的接口,用他们的域名, 然后我们的微信小程序就需要在后台配置不同公司的request合法域名, 但是我看微信小程序里面最多配置200个合法域名,而且到时候如果2000个,20000个呢, 这种情况该如何处理呢? 我想的是可以做一个代理转发,就放一个中间的请

  • 本文向大家介绍微信小程序开发教程之增加mixin扩展,包括了微信小程序开发教程之增加mixin扩展的使用技巧和注意事项,需要的朋友参考一下 Mixin简介 Mixin(织入)模式并不是GOF的《设计模式》归纳中的一种,但是在各种语言以及框架都会发现该模式(或者思想)的一些应用。简单来说,Mixin是带有全部实现或者部分实现的接口,其主要作用是更好的代码复用。 Mixin这个概念在React, Vu

  • 本文向大家介绍微信小程序云开发之云函数详解,包括了微信小程序云开发之云函数详解的使用技巧和注意事项,需要的朋友参考一下 在上一章我们已经配好了环境,这章我们按照模板的顺序去执行提供的案例,对官方文档进行一个实践操作。 首先我们点击”点击获取 openid “文字,发现控制台报错: 云函数 调用失败 Error: errCode: -404011 cloud function execution e

  • 本文向大家介绍微信小程序云开发之使用云存储,包括了微信小程序云开发之使用云存储的使用技巧和注意事项,需要的朋友参考一下 上一节为大家介绍了下云开发的搭建,接下来为大家介绍下怎么使用云存储,顾名思义,云存储当然就是我们平常所说的百度网盘用来存储自己的资源,当然我们这里的云存储不仅可以存储自己的素材还可以在云数据库调用自己云存储的数据,这既是云开发的一大特色之处吧,话不多说直接说下周末操作吧。 【步骤