Summary of solutions to questions in WeChat mini program development

This article mainly summarizes various questions and answers about the development of WeChat mini programs. The article organizes and answers all the problems that may be encountered in the development of WeChat mini programs, which will provide some reference for everyone. Value, friends in need come and take a look below.

Preface

Recently summarized an answer to a WeChat mini program. As a mini program person, I have a deep understanding of the changes here. The mini program has just When I released the news, I made a point that only if the components or APIs provided by the mini program are rich, stable, and compatible can the concept of rapid development of mini programs be realized. Nowadays, there are still many components whose compatibility is not ideal, and some are not. In the optimization, because the platform development based on small programs is very limited, we can only sit and wait. . . If you want to use a third-party library to implement it, the mini program clearly stipulates that the third-party library is not supported. In the end, the mini program review process will be 100% failed.

1.scroll-view has a bug on iOS

When using this component to develop a page, due to the built-in scrolling effect, the Y-axis sliding in the pull-down triggers iOS When using the native rubber band effect, scroll-view has a bug that it cannot slide. This bug does not exist when there is no rubber band effect under the Android system. If the latest version 0.11.122100 still exists, it will be processed in the next version.

2. In WeChat version 6.3.31, the input focus is invalid

This will be solved in the mini program update log record

2016-12-22 Update log

1.F Fix the problem of clearing content when the component loses focus on the developer tools

3. Use navigation jump on iOS When transferring pages, a white screen bug may occasionally appear

The official is aware of it and will fix it in later versions

4. The size of the tabBar icon is inconsistent on various platforms

Officially known, it will be fixed in later versions

5. There is a modified bug in the return navigation bar on iOS

tabBar The problem is officially known. The next version will add a switchTab interface to allow developers to directly control the switching of tabBar

6. The map overlay cannot add click events and cannot obtain which overlay the user clicked

Officially known, it will be fixed in later versions

7. Can the mini program support webview in disguise

Not supported

8. After Android WeChat is updated to 6.3.32, it does not support jumping from a normal page to a page with a tab bar.

The new version will have a special API to jump to the tabbar. Page, the previous processing method will have logical problems

9. How to implement circular carousel with swiper

The current version supports the circular attribute

10. When clicking multiple inputs quickly, a problem will occur.

This problem is officially fixed, waiting for the release version

11. When debugging, WXML often appears blank The situation

has been fixed, and the next version of the development tools will be updated

12. When scroll-view overlaps, there will be an event penetration problem

The official follow-up will fix it

13. Under Android, the border of 1rpx may not be displayed.

There is a small problem in some Android mobile phones. The problem of incomplete display of numerical rpx, the new version of WeChat will fix this problem

14. Can you open ordinary web links from mini programs

Not supported now

15.Scroll-view contains textarea, its content cannot be changed

Officially does not currently support

16.WXSS file writing CSS 3 animation, click compile and an error will be reported directly. The compilation does not pass

Currently the applet supports very few css3 properties, and the official will support more css3 properties in the future

17. In the canvas-related API of the WeChat applet, we found that there is a lack of relevant API interfaces for converting canvas into images.

WeChat 6.3.30 has supported wx.canvasToTemFilePath, which can be used to convert canvas into Temporary image file path

18. The currently provided canvas drawing interface is not compatible with the web native API

Yes

19. Mini program development, how to move Tab to the top

WeChat 6.3.30 has supported setting the position parameter in tabBar

20. Is there any way to get pictures in the API of the mini program? The original width and height interface

WeChat 6.3.30 has supported it. The bindload event of the image component can return the original width and height of the image

21. The applet can reference external Is it a chart library, such as ECharts

is not officially supported yet

22. When developing small programs, can I use custom font icons

Custom fonts are supported, but online fonts need to be used, and the server storing the fonts needs to allow cross-domain

23. The official ES6 to ES5 conversion will report an error on Android

The ES6 to ES5 function provided by the development tools only converts the syntax. New ES6 APIs such as Promise require developers to introduce Polyfill or other class libraries to solve the problem

24.wx.getImageInfo has a bug that cannot get information on Android

WeChat version 6.3.31 Android client has this bug, and the new version will fix it

25. The size of the mini program is 1 MB. Will this control be enlarged when it is officially released?

The current answer is that it will not be enlarged

26. What should I do if the unionid cannot be obtained through the getUserInfo interface?

You need to go to the WeChat Open Platform website (https://open.weixin.qq.com) to bind the mini program and your other public accounts or app, will return unionid

27. Does the WeChat applet support interaction with hardware? For example, data communication can be performed with the hardware through Bluetooth or Wi-Fi

The official may launch this function in the future

28. What is the format of the completed recording

The recording on the mobile phone is currently in SILK format. SILK is a voice and audio codec developed internally by Skype and is used as the default codec for Skype-to-Skype calls. SILK's high scalability in terms of audio bandwidth, network bit rate and complexity makes it a codec that can choose from multiple modes and applications

29. Does the mini program open user mobile phone communication? The read/write permission of the record

is currently not supported

30. iPad seems to be unable to preview the mini program

The mini program is currently temporarily iPad is not supported

31. Does the mini program support forwarding text, pictures, and links to friends and Moments

Official answer: Sharing capabilities will be provided soon , please pay attention to the official document

32. Whether checkbox can only bind events through checkbox-group

checkbox will not trigger the change event, checkbox-group will trigger

33. Scroll the page, scroll to the bottom, and load new content cannot be implemented

WeChat 6.3.30 has supported the page configuration onReachBottom event

34. Canvas information cannot be saved when using canvas component

Official answer: Not supported yet, we will support it soon

35. The header of uploadfile cannot be included Cookie parameters

WeChat 6.3.31 version of the iOS client has this bug, and the new version will be fixed soon

36. Mustache syntax (double braces) in WXML to bind If the corresponding target data is a piece of HTML text, can it be bound? How should it be bound?

Officially not currently supported

37. Can I use some tool libraries in the code? For example, you can install a third-party tool library through npm install

Officially currently not supported

38. It seems that the image width and height cannot be obtained through JS. Is there a solution?

Currently, only the width and height of the set image can be displayed

39. Does the WeChat applet have a way to make calls and send emails?

Currently, phone calls are supported, but emails are not supported for the time being

40. If the payment is made to a sub-merchant, is the calling interface the same as the previous web development usage?

Currently, payment to sub-merchant is not supported

41. In addition to its own API interface, does the WeChat mini application support the loading of other external APIs or JS plug-ins?

Currently not supported

42. Whether to support video live broadcast or audio live broadcast, such as HLS

Official answer: We are technically working on it It is being continuously improved and support will be provided soon

43. Monitor the mobile phone keyboard. If the "Finish" button is triggered, perform the corresponding action. No relevant API has been found so far. Is there any support

Input box (input/textarea) The event listening attribute of bindconfirm will be provided later, which is used to monitor the click of the "Complete" button

44. The development tool does not support Linux environment and Windows 2003/XP system

is not currently supported

45. I develop the WeChat applet and server program at the same time on one machine. How to use the WeChat applet during development? How to access my local server

Currently the server must use a domain name and does not support local debugging

46. How to send feedback directly to the reviewer

Official answer: We will submit the review page in the subsequent WeChat public platform applet, add a test account (account + password form), and fill in the review description, etc. Regarding review issues, you can send an email to: AppReview@tencent.com, and we will arrange for someone to review the feedback

47. Can’t individual developers register?

Now supported Only enterprises, governments, media, and other organizations, individual developers do not support registration

48. When using Promise in writing code with mini program tools, an error is reported: TypeError: Promise is not a constructor, yes What went wrong

Official answer: In order to ensure the unification of the three ends, the 0.11.112300 version of the tool removes Promise, and developers need to introduce the compatibility library by themselves

So I introduced it myself A promise.min library that is lightweight and solves

49. The input component has a bindInput event, but the textarea component does not

on December 22, 2016 Added component event bindinput</p> <p><strong>50. Will the last data cache still be there after switching WeChat ID</strong></p> <p>Official answer: It will not be cleared , but after other users log in, they cannot access the data left by the previous user</p> <p><strong>51. After defining tabBar, jumps such as wx.navigateTo will be invalid</strong></p> <p>I did not use the official tabBar during development, but wrote a tabBar myself, so I did not encounter such a scenario. If I use the official tabBar, just use wx.switchTab to jump</p> <p><strong> 52.Background-image sets the relative path and cannot display the image</strong></p> <p>You can use the network address image, or base64 or use the image tag to solve the problem</p> <p><span style="color: #ff0000"><strong>Summary</strong> </span></p><p>The above is the detailed content of Summary of solutions to questions in WeChat mini program development. For more information, please follow other related articles on the PHP Chinese website!</p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Statement：</span><div>The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn</div></div></div><div class="nphpSytBox"><span>Previous article：<a class="dBlack" title="Detailed explanation of data processing implemented by WeChat applet" href="http://m.php.cn/faq/378597.html">Detailed explanation of data processing implemented by WeChat applet</a></span><span>Next article：<a class="dBlack" title="Detailed explanation of data processing implemented by WeChat applet" href="http://m.php.cn/faq/378599.html">Detailed explanation of data processing implemented by WeChat applet</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Related articles</h2><em><a href="http://m.php.cn/article.html" class="bBlack"><i>See more</i><b></b></a></em><div class="clear"></div></div><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/faq/347763.html" title="WeChat Mini Program Simple DEMO layout, logic, and style exercises" class="aBlack">WeChat Mini Program Simple DEMO layout, logic, and style exercises</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/347764.html" title="Detailed explanation and examples of WeChat applet wx.request (interface calling method)" class="aBlack">Detailed explanation and examples of WeChat applet wx.request (interface calling method)</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/347765.html" title="WeChat Mini Program - Detailed explanation of WeChat login, WeChat payment, and template messages" class="aBlack">WeChat Mini Program - Detailed explanation of WeChat login, WeChat payment, and template messages</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/347766.html" title="WeChat applet (application account) simple example application and detailed explanation of the example" class="aBlack">WeChat applet (application account) simple example application and detailed explanation of the example</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/347767.html" title="Detailed explanation of WeChat applet for loop" class="aBlack">Detailed explanation of WeChat applet for loop</a><div class="clear"></div></li></ul></div></div><div class="nphpFoot"><div class="nphpFootBg"><ul class="nphpFootMenu"><li><a href="http://m.php.cn/"><b class="icon1"></b><p>Home</p></a></li><li><a href="http://m.php.cn/course.html"><b class="icon2"></b><p>Course</p></a></li><li><a href="http://m.php.cn/wenda.html"><b class="icon4"></b><p>Q&A</p></a></li><li><a href="http://m.php.cn/login"><b class="icon5"></b><p>My</p></a></li><div class="clear"></div></ul></div></div><div class="nphpYouBox" style="display: none;"><div class="nphpYouBg"><div class="nphpYouTitle"><span onclick="$('.nphpYouBox').hide()"></span><a href="http://m.php.cn/"></a><div class="clear"></div></div><ul class="nphpYouList"><li><a href="http://m.php.cn/"><b class="icon1"></b><span>Home</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/course.html"><b class="icon2"></b><span>Course</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/article.html"><b class="icon3"></b><span>Article</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/wenda.html"><b class="icon4"></b><span>Q&A</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/dic.html"><b class="icon6"></b><span>Dictionary</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/course/type/99.html"><b class="icon7"></b><span>Manual</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/xiazai/"><b class="icon8"></b><span>Download</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/faq/zt" title="Topic"><b class="icon12"></b><span>Topic</span><div class="clear"></div></a></li><div class="clear"></div></ul></div></div><div class="nphpDing" style="display: none;"><div class="nphpDinglogo"><a href="http://m.php.cn/"></a></div><div class="nphpNavIn1"><div class="swiper-container nphpNavSwiper1"><div class="swiper-wrapper"><div class="swiper-slide"><a href="http://m.php.cn/" >Home</a></div><div class="swiper-slide"><a href="http://m.php.cn/article.html" class="hover">Article</a></div><div class="swiper-slide"><a href="http://m.php.cn/wenda.html" >Q&A</a></div><div class="swiper-slide"><a href="http://m.php.cn/course.html" >Course</a></div><div class="swiper-slide"><a href="http://m.php.cn/faq/zt" >Topic</a></div><div class="swiper-slide"><a href="http://m.php.cn/xiazai" >Download</a></div><div class="swiper-slide"><a href="http://m.php.cn/game" >Game</a></div><div class="swiper-slide"><a href="http://m.php.cn/dic.html" >Dictionary</a></div><div class="clear"></div></div></div><div class="langadivs" ><a href="javascript:;" class="bg4 bglanguage"></a><div class="langadiv" ><a onclick="javascript:setlang('zh-cn');" class="language course-right-orders chooselan " href="javascript:;"><span>简体中文</span><span>（ZH-CN）</span></a><a onclick="javascript:;" class="language course-right-orders chooselan chooselanguage" href="javascript:;"><span>English</span><span>（EN）</span></a><a onclick="javascript:setlang('zh-tw');" class="language course-right-orders chooselan " href="javascript:;"><span>繁体中文</span><span>（ZH-TW）</span></a><a onclick="javascript:setlang('ja');" class="language course-right-orders chooselan " href="javascript:;"><span>日本語</span><span>（JA）</span></a><a onclick="javascript:setlang('ko');" class="language course-right-orders chooselan " href="javascript:;"><span>한국어</span><span>（KO）</span></a><a onclick="javascript:setlang('ms');" class="language course-right-orders chooselan " href="javascript:;"><span>Melayu</span><span>（MS）</span></a><a onclick="javascript:setlang('fr');" class="language course-right-orders chooselan " href="javascript:;"><span>Français</span><span>（FR）</span></a><a onclick="javascript:setlang('de');" class="language course-right-orders chooselan " href="javascript:;"><span>Deutsch</span><span>（DE）</span></a></div></div><script> var swiper = new Swiper('.nphpNavSwiper1', { slidesPerView : 'auto', observer: true,//修改swiper自己或子元素时，自动初始化swiper observeParents: true,//修改swiper的父元素时，自动初始化swiper }); </script></div></div><!--顶部导航 end--><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了，就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>