「小程序JAVA實戰」小程序 loading 提示框與頁面跳

登錄注冊都完成了，有可能會遇到一些問題，服務器繁忙的話，后臺接口卡主了，也沒任何提示，小程序端的用戶比較暴力一直惦記怎么辦。

加載提示框，隱藏加載中提示框，頁面跳轉

https://developers.weixin.qq.com/miniprogram/dev/api/api-react.html#wxshowtoastobject
https://developers.weixin.qq.com/miniprogram/dev/api/api-react.html#wxhideloading

跳轉實例

• 用戶登錄

• 用戶注冊

const?app?=?getApp()

Page({
??data:?{

??},

??doLogin:?function?(e)?{
????var?formObject?=?e.detail.value;
????var?username?=?formObject.username;
????var?password?=?formObject.password;

????//?簡單驗證
????if?(username.length?==?0?||?password.length?==?0)?{
??????wx.showToast({
????????title:?'用戶名或密碼不能為空',
????????icon:?'none',
????????duration:?3000
??????})
????}?else?{
??????wx.showLoading({
????????title:?'正在加載中。。。'
??????});
??????wx.request({
????????url:?app.serverUrl?+?"/login",
????????method:?"POST",
????????data:?{
??????????username:?username,
??????????password:?password
????????},
????????header:?{
??????????'content-type':?'application/json'?//?默認值
????????},
????????success:?function?(res)?{
??????????console.log(res.data);
??????????var?status?=?res.data.status;
??????????wx.hideLoading();
??????????if?(status?==?200)?{
????????????wx.showToast({
??????????????title:?"用戶登陸成功~！",
??????????????icon:?'none',
??????????????duration:?3000
????????????})
????????????app.userinfo?=?res.data.data;
??????????}?else?if?(status?==?500)?{
????????????wx.showToast({
??????????????title:?res.data.msg,
??????????????icon:?'none',
??????????????duration:?3000
????????????})
??????????}
????????}
??????})
????}
??},
??goLoginPage:?function?(e)?{
????console.log("跳轉到注冊");
??}
})

• 用戶注冊

const?app?=?getApp()

Page({
????data:?{

????},

????doRegist:?function(e)?{
??????var?formObject?=?e.detail.value;
??????var?username?=?formObject.username;
??????var?password?=?formObject.password;

??????//?簡單驗證
??????if?(username.length?==?0?||?password.length?==?0)?{
????????wx.showToast({
??????????title:?'用戶名或密碼不能為空',
??????????icon:?'none',
??????????duration:?3000
????????})
??????}else{
????????wx.showLoading({
??????????title:?'正在加載中。。。'
????????});
????????wx.request({
??????????url:?app.serverUrl?+"/regist",?
??????????method:"POST",
??????????data:?{
????????????username:?username,
????????????password:?password
??????????},
??????????header:?{
????????????'content-type':?'application/json'?//?默認值
??????????},
??????????success:?function?(res)?{
????????????console.log(res.data);
????????????var?status?=?res.data.status;
????????????wx.hideLoading();
????????????if(status?==?200){
??????????????wx.showToast({
????????????????title:?"用戶注冊成功~！",
????????????????icon:?'none',
????????????????duration:?3000
??????????????})
??????????????app.userinfo?=?res.data.data;
????????????}else?if(status?==?500){
??????????????wx.showToast({
????????????????title:?res.data.msg,
????????????????icon:?'none',
????????????????duration:?3000
??????????????})
????????????}
??????????}
????????})
??????}
????},
????goLoginPage:function(e){
??????console.log("跳轉到登錄");
????}
})

• 用戶登錄跳轉

const?app?=?getApp()

Page({
??data:?{

??},

??doLogin:?function?(e)?{
????var?formObject?=?e.detail.value;
????var?username?=?formObject.username;
????var?password?=?formObject.password;

????//?簡單驗證
????if?(username.length?==?0?||?password.length?==?0)?{
??????wx.showToast({
????????title:?'用戶名或密碼不能為空',
????????icon:?'none',
????????duration:?3000
??????})
????}?else?{
??????wx.showLoading({
????????title:?'正在加載中。。。'
??????});
??????wx.request({
????????url:?app.serverUrl?+?"/login",
????????method:?"POST",
????????data:?{
??????????username:?username,
??????????password:?password
????????},
????????header:?{
??????????'content-type':?'application/json'?//?默認值
????????},
????????success:?function?(res)?{
??????????console.log(res.data);
??????????var?status?=?res.data.status;
??????????wx.hideLoading();
??????????if?(status?==?200)?{
????????????wx.showToast({
??????????????title:?"用戶登陸成功~！",
??????????????icon:?'none',
??????????????duration:?3000
????????????})
????????????app.userinfo?=?res.data.data;
??????????}?else?if?(status?==?500)?{
????????????wx.showToast({
??????????????title:?res.data.msg,
??????????????icon:?'none',
??????????????duration:?3000
????????????})
??????????}
????????}
??????})
????}
??},
??goRegisterPage:?function?(e)?{
????wx.redirectTo({
??????url:?'../userRegister/userRegister',
????})
??}
})

• 用戶注冊跳轉
  userRegister.js

const?app?=?getApp()

Page({
????data:?{

????},

????doRegist:?function(e)?{
??????var?formObject?=?e.detail.value;
??????var?username?=?formObject.username;
??????var?password?=?formObject.password;

??????//?簡單驗證
??????if?(username.length?==?0?||?password.length?==?0)?{
????????wx.showToast({
??????????title:?'用戶名或密碼不能為空',
??????????icon:?'none',
??????????duration:?3000
????????})
??????}else{
????????wx.showLoading({
??????????title:?'正在加載中。。。'
????????});
????????wx.request({
??????????url:?app.serverUrl?+"/regist",?
??????????method:"POST",
??????????data:?{
????????????username:?username,
????????????password:?password
??????????},
??????????header:?{
????????????'content-type':?'application/json'?//?默認值
??????????},
??????????success:?function?(res)?{
????????????console.log(res.data);
????????????var?status?=?res.data.status;
????????????wx.hideLoading();
????????????if(status?==?200){
??????????????wx.showToast({
????????????????title:?"用戶注冊成功~！",
????????????????icon:?'none',
????????????????duration:?3000
??????????????})
??????????????app.userinfo?=?res.data.data;
????????????}else?if(status?==?500){
??????????????wx.showToast({
????????????????title:?res.data.msg,
????????????????icon:?'none',
????????????????duration:?3000
??????????????})
????????????}
??????????}
????????})
??????}
????},
????goLoginPage:function(e){
??????wx.redirectTo({
????????url:?'../userLogin/userLogin',
??????})
????}
})

PS：這次就是我們的跳轉和loading的介紹。