Shulou(Shulou.com)06/01 Report--

This article introduces the relevant knowledge of "how to use wx.previewImage in WeChat Mini Programs". In the operation of actual cases, many people will encounter such a dilemma. Next, let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

A little knowledge

Wx.previewImage is the api of the preview image function provided by WeChat Mini Programs officially.

Preview the picture in full screen on the new page. In the process of preview, users can save pictures, send them to friends and other operations.

So what kind of holes does he have?

The problems I encountered were hidden deep, and I discovered it when I was parsing rich text using wxParse. WxParse adds a click event to the img when parsing it, so what is this click event?

The picture is below:

You can see that it is the picture preview function of Wechat. Among them, that.setData ({isPreview:true}) is added by me to determine whether the picture has been clicked or not. It doesn't exist in itself, so ignore it at this time.

First of all, when you click on the picture preview, it will terminate all the operations that are being performed on the page. Why? I guess it triggered the onHide function of the page, and when I typed log in onHide, it proved that I was correct.

When you click on the image again, the onShow event on the page will be triggered again. So, when you have operations performed in onHide or onShow functions, you should note that both functions will be triggered, so you need to judge whether these two functions are triggered by normal page load hiding or by clicking on the image preview, so I added a sentence that.setData ({isPreview:true}) to the wxParseImgTap in the source wxParse.js of wxParse. We can then use isPreview to determine whether onShow and onHide are triggered by the preview image.

At this point we do not address the fact that the page event is terminated because the thread is terminated. Because js is single-threaded, when you preview a picture, you will request a picture src from the server, so other asynchronous operations will be stopped. Because the preview image is a synchronous operation, when you click on the picture, the picture preview has the highest priority and other actions are paused. When you click the picture again to return to its original shape, the picture preview is completed, and the previous paused action of the page will be automatically continued in the developer tool. But the real machine debugging is not.

This is the end of the content of "how to use wx.previewImage in WeChat Mini Programs". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.