wx.previewImage预览图片这个过程到底发生了什么?

首先我们点击图片预览,附上查看图片代码:

<image class="headImg" data-src="{{myData.firstPageBgm}}" bindtap="lookImg" mode="aspectFill" src="{{myData.firstPageBgm}}"></image>
// 图片预览
lookImg(e) {
const url = e.target.dataset.src;
const box = new Array();
box.push(url);
wx.previewImage({
current: url,
urls: box
})
},

打印结果是,在点击图片预览时触发了onHide函数:

再次点击图片, 返回到页面-----发生:

会触发onShow函数,而我在onShow函数里写了调用接口返回后端数据,加载页面数据等等,怪不得会重新加载页面。

解决办法如下:

一、设置变量  isPreview 为true不触发onshow里面的函数

  

二、在onShow函数添加判断

点击图片,isPreview为true,则不触发onShow里的接口调用等等代码;

三、在预览图片函数里添加isPreview = true

搞定了,  诸位 如果有更好方法 或者 疑点请告知在下;

参考链接:https://blog.csdn.net/weixin_42512816/article/details/110161995

小程序wx.previewImage查看图片再次点击返回时重新加载页面问题的更多相关文章

  1. 【微信小程序】微信小程序wx.previewImage预览图片

    一.小知识 二.例子,配合轮播图使用效果更佳!(如图1) 1.wxml <scroll-view scroll-y="true"> <swiper catchta ...

  2. 微信小程序wx.previewImage实用案例(交流QQ群:604788754)

    本案例是可以滑动预览多张图片效果.(本案例在本地配置好之后,请扫描二维码到手机滑动预览.在开发者工具上预览,滑动不是很流畅) 图片必须选择远程图片,本地图片无法实现预览. 或是通过wx.chooseI ...

  3. 微信小程序开发之多图片上传+服务端接收

    前言: 业务需求,这次需要做一个小程序同时选中三张图片一起上传到服务端,后端使用的.NET WEBAPI接收数据保存. 使用技术: 在这章中将会使用到微信小程序wx.uploadFile(Object ...

  4. 微信小程序--canvas画布实现图片的编辑

    技术:微信小程序   概述 上传图片,编辑图片大小,添加文字,改变文字颜色等 详细 代码下载:http://www.demodashi.com/demo/14789.html 概述 微信小程序--ca ...

  5. 微信小程序-显示外链图片 bug

    微信小程序-显示外链图片 bug 显示外链图片 bug 403 bug 禁止外链,未授权 https://httpstatuses.com/403 image component 图片.支持 JPG. ...

  6. 微信小程序wx.getLocation()获取经纬度及JavaScript SDK调用腾讯地图API获取某一类地址

    简介 腾讯位置服务为微信小程序提供了基础的标点能力.线和圆的绘制接口等地图组件和位置展示.地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品. 在此基础上,腾讯位置服务 ...

  7. 微信小程序wx.request接口

    微信小程序wx.request接口 wx.request是小程序客户端与服务器端交互的接口 HTTPS 请求 一个微信小程序,只能同时(同时不能大于5个)有5个网络请求 wx.request(OBJE ...

  8. ***小程序wx.getUserInfo不能弹出授权窗口后的解决方案

    微信更新api后,wx.getUserInfo在开发和体验版本都不能弹出授权窗口.微信文档说明: 注意:此接口有调整,使用该接口将不再出现授权弹窗,请使用 <button open-type=& ...

  9. 微信小程序:本地资源图片无法通过 WXSS 获取,可以使用网络图片或者 base64或者使用image标签

    微信小程序:本地资源图片无法通过 WXSS 获取,可以使用网络图片或者 base64或者使用image标签 一.问题 报错信息: VM696:2 pages/user/user.wxss 中的本地资源 ...

随机推荐

  1. 矩池云 | 新冠肺炎防控:肺炎CT检测

    连日来,新型冠状病毒感染的肺炎疫情,牵动的不仅仅是全武汉.全湖北,更是全国人民的心,大家纷纷以自己独特的方式为武汉加油!我们相信坚持下去,终会春暖花开. 今天让我们以简单实用的神经网络模型,来检测肺炎 ...

  2. Linux swap分区操作

    swap交换分区是系统RAM的补充,swap 分区支持虚拟内存.当没有足够的 RAM 保存系统处理的数据时,会将数据写入 swap 分区,当系统缺乏 swap 空间时,内核会因 RAM 内存耗尽而终止 ...

  3. tp5 终端命令总结

    D:\PHP\phpstudy_pro\WWW\1906A\tp5>php think build --module examTest Successed D:\PHP\phpstudy_pro ...

  4. 循环输出 一个li里边两个图片循环

    <ul> <li><img src="123454"/><img src="123454"/></li&g ...

  5. java方法学习

    java方法学习 方法概念 什么是方法 方法就是完成某些事情的过程,如:实现两个数相加,用方法add(数值1,数值2). 1.System.out.print(),System是系统的一个类,out是 ...

  6. 禁用 Windows 共享服务,释放 445 端口

    禁用 Windows 共享服务,释放 445 端口 转载自:https://blog.csdn.net/liu857279611/article/details/71786068   在 Window ...

  7. LGP6011题解

    昨天考试考到了这道题,那就来补一下题解吧. 题意简单不再阐述. 首先删除之后还要向左移动,很容易想到 ODT 平衡树,这个过于一眼,不再阐述. 重点说第二种方法. 向左平移的这个操作,我们是否可以用别 ...

  8. 写给开发人员的实用密码学(七)—— 非对称密钥加密算法 RSA/ECC

    本文部分内容翻译自 Practical-Cryptography-for-Developers-Book,笔者补充了密码学历史以及 openssl 命令示例,并重写了 RSA/ECC 算法原理.代码示 ...

  9. MVC 生成安全验证码(例:用于登陆验证)(转)

    ---------html <td>验证码:</td> <td> <img src="/Login/CheckCode?ID=1" id= ...

  10. String 和StringBuffer、StringBuilder的区别?

    Java提供了:String.StringBuffer和StringBuilder,它们都是CharSequence的实现类,都可以作为字符串使用. String代表了字符序列不可变的字符串:而Str ...