Solution to the failure of home page data initialization of wechat applet

1、 Problem description

When the user enters the applet again after the first time, we usually need to exchange data with the background by obtaining the user openid or unionid as the unique identifier to initialize the user information. When we establish a request with wechat through a third-party server, wechat needs the user to confirm whether to disclose the information. As shown in Figure 1, from the console, we can see that while requesting, our home page index has been loaded, and the initialization data in the figure is empty. Whether we write the request information in onload of app.js or index.js, the request information executes the success method after we click confirm to process the data returned by the third-party server. Due to the lag caused by the user's click, it is difficult for us to ask the program to stop and wait for us. Then, we can achieve the illusion of "stopping" the program through other ways. Let me introduce my solution below.

Figure 1

2、 Basic requirements for solutions

The most basic requirements of the solution we want are as follows:

1) When we enter the home page, the data is initialized and displayed normally

2) When the user enters the program for the first time, he can normally enter the home page by confirming the public information

3、 Solution

My solution is to design a "temporary loading page" to achieve the desired effect. This temporary loading page is similar to the welcome interface of Android, but when the data loading is completed or I enter for the second time, it will automatically jump to our home page. The following is the design code.

Step 1: first, we create a new page in app.json, named welcome

"pages/welcome/welcome"

Note that this page should be placed on the home page, that is, the first page of the program

Step 2: in welcome.js, we write the specific request operation to onload

It can be seen that when we log in for the first time, we will enter our welcome interface. When the user confirms the public information, the page will automatically jump to the home page, and the home page data will be displayed normally

At the second entry, the jump was performed in onload, and the jump was performed before the interface was rendered, so the speed was very fast. The personal test jump was satisfactory, but after all, we still made a detour to do one thing. If you have a better method, please share it. Thank you!

The above is the solution to the failure of wechat applet home page data initialization introduced by Xiaobian. I hope it will help you. If you have any questions, please leave me a message and Xiaobian will reply to you in time!