CSDN migration is one of the most popular small programs in the world

Copyright notice: This article is originally published BY the blogger. It follows the COPYRIGHT agreement CC 4.0 BY-SA. Please attach the link of the original source and this statement. Link to this article: blog.csdn.net/qq_32858649…

The first project that says small procedure steps pit so much, afflict …………

NavigateTo network delay produces continuous jump problem, using throttling function

// Call the enclosed throttling function to prevent bugs, only jump once per second thating.binging ();Copy the code
If no, go to step 2. If no, go to step 3. If no, go to step 3.function () {
    wx.navigateTo({
        url:'/pages/index/binding/binding'}); }, 500).Copy the code
Parameter 1: function, parameter 2: interval time milliseconds, 1000 is one secondfunction throttle(fn, gapTime) {
    if (gapTime == null || gapTime == undefined) {
        gapTime = 1000
    }
    letlastTime = null; // Return the new functionreturn function () {
        let nowTime = + new Date();
        if(nowTime - lastTime > gapTime || ! lastTime) { fn.apply(this, arguments); // Pass this and the argument to the function lastTime = nowTime}}}Copy the code

Two, small program MAC and Android machine style incompatible (most pit, different iPhone display effect is not the same, such as the new apple normal, old apple abnormal)

1. When the page is switched back, it is found that the last page is abnormal

The problem with putting everything in a view is that the image tag is outside, so when you return to the page, the whole page is stretched out and out of place

And the wechat version can cause problems

2, Text Android location based on the last element, MAC based on the top of the page

Posation: Absolute, error caused, keep the same page structure, remove it. Restyle the page

3. Canvas hides problems

Your overflow should be written on top of the parent element, otherwise android won’t be able to hide it

4. The canvas div on Android can click events, but not on iPhone

Solution: Do not let other elements on the canvas, adjust the page style

5. Canvas of Apple phone is distorted and inconsistent with Android

Canvas pages should not have posation: Absolute and fiexd

6. Locate the problem of confusion

For example, if you want to specify an element to be fixed in a certain place, the fixed effect can appear glint or the fixed effect fails on the iPhone.

Solution: Do not place elements in scrolling elements. Apple’s out-of-document flow is not always accurate, and sometimes it does not

Three, unable to solve the problem

Small program input will blink and lose focus, keyboard pull abnormal, wechat bug

Four, small program page life cycle problem

1. OnReady cannot ensure that the page is loaded properly and components cannot be obtained

The timer is used to obtain the event periodically. The event starts only when the event is successfully obtained

5. Get and POST data problems

1. When sending data using POST, the corresponding Tomcat background header needs to be set as follows:

 {'content-type': 'application/x-www-form-urlencoded'}
Copy the code

2. When the number transmitted from the background is very long, the last few digits of the number will become “00”, which requires the background to send data in string format

5. Cache

1. The situation can only occur during the first authorization.

Case: no cached data will be obtained after the imported JS file is stored in the cache by the authorized login function immediately.

Solution: If the current page is cached, data must be used on other pages. Caching functions are not used in JS package files