1. wx.request asynchronous request
The WeChat applet wx.request request is not a simple JS asynchronous request, so it is not a cross-domain request, but a server-side request encapsulated by the WeChat SDK
Note: The small program development server interface must use the https protocol
2, the navigator does not jump the problem
If the url address of the navigator is configured in the list array of the tarbar of app.json, the navigator jump will be invalid.
3. The problem of assigning attributes of custom components of small programs
If you want to customize the component properties of the custom components in the applet, you need to start with data-, and you can get the value of the corresponding property through e.currentTarget.dataset. Otherwise, the js file cannot get the value of the property, for example:
<view class='select_btns'>
<button type="default" data-gametype="{{item.game_type}}" data-gameid='{{item.game_id}}' data-gamename='{{item.game_name}}' bindtap='changeState' id="{{item.id}}" size="" class="{{projectId==item.id?'current_selected':''}}" hover-class="other-button-hover"
wx:for="{{detailMatch.apply_games}}" wx:key="{{item.id}}"> {{item.game_name}} </button>
</view>
Relevant JS files can obtain the data-gametype value through e.currentTarget.dataset.gametype
4. The problem that the applet cannot get the value due to asynchronous
Solution: 1. Use callback function
2. Use promise (personally understood as the encapsulation of callback)
The essence of promise is the chain call of its then function. Its function is to express asynchronous operations in the form of synchronous operations, and then execute the then function after an operation ends. For theoretical knowledge, you can refer to related books (provided by ES6), Examples are as follows:
Step 1: app.js asynchronously requests to set the global nickname. Since the request is asynchronous, other pages (user.js) may have global variables that have not yet been set when using nicknames.
setLocalInfo: function (code) {
var self = this;
var promise = new Promise((resolve, reject) => {
// Send res.code to the background in exchange for openId, sessionKey, unionId
//console.log(res.code);
// Send res.code to the background in exchange for openId, sessionKey, unionId
//Request the developer server to get the login verification
wx.request({
url: "https://es.cga.com.cn/weapp/user/wxlogin",
data: { code: code },
method: 'GET',
success: function (result) {
//The request is successful and the result is returned
if (result.data.errno == "0") {
wx.setStorageSync("es_sign", encodeURI(result.data.data["c_sign"]).replace(/\+/g, '%2B'));
self.globalData.user_nick = result.data.data["user_nick"];
wx.setStorageSync("user_nick", self.globalData.user_nick);
resolve(result.data.data["user_nick"]);
}
}
});
})
return promise;
}
Step 2: The user information page calls the setLocalInfo function
app.setLocalInfo(data).then(function (res) {})
Description: 1. The setLocalInfo function must return a promise object. Promise can pass in two parameters (resolve, reject), resolve is the successful execution function of the asynchronous call, and reject is the execution function of the asynchronous call failure
2. The execution of resolve(data) will pass data to the called then function, which is the res of then
3. Reference article: https://segmentfault.com/a/1190000007678185
5. The links in the tabbar must be defined in the pages of app.json
6. Small program life cycle, to be continued...