微信小程序異步請求問題


微信小程序為了提高用戶體驗,提供的api大部分都是異步操作,除了數據緩存操作里面有一些同步操作。是提高了用戶體驗,但是在開發的時候,

就有點坑了,例如我要寫一個公共方法,發起網絡請求,去后台去一些數據,成功之后,再做一些操作,但是由於wx.request是異步請求,就會

導致,網絡請求還沒結束,就會執行后面的代碼,從而引起異常,怎么解決這種異步導致的問題呢,當然是promise了。看例子:

公共common.js里封裝了一個得到用戶實體的方法:

//發起請求,得到用戶實體
function GetUserEntity() {
  wx.request({
    url: http_config.getUserDetail,
    data: {
      Sha1OpenId: wx.getStorageSync('LoginSessionKey')
    },
    success: (res) => {
      let result = res.data.data;
      console.log(result)
      return result;
    },
    fail: () => {
      return "系統異常,請重試!"
    }
  })
}
module.exports.GetUserEntity = GetUserEntity

  然后在另一個js中調用這個方法,得到用戶實體成功之后,在進行一系列操作:

const com = require(`${root_path}/utils/common.js`)
//在方法中進行一下操作

    let userEntity = com.GetUserEntity();
    console.log(userEntity.Sex)
    console.log("得到實體之后進行的操作")

 執行之后會發現,程序報錯

明明實體用有Sex這個屬性,為什么報錯,這就是異步請求造成的問題,請求還沒返回值,下面的代碼已經執行了。

解決辦法:利用promise

網絡請求改成:

function GetUserEntity() {
  return new Promise(function (resolve, reject) { 
    wx.request({
      url: http_config.getUserDetail,
      data: {
        Sha1OpenId: wx.getStorageSync('LoginSessionKey')
      },
      success: (res) => {
        let result = res.data.data;
        resolve(result) ;
      },
      fail:()=>{
        reject("系統異常,請重試!")
      }
    })
  })
  
}

 請求方法改成:

comm.GetUserEntity().then((res) => { console.log(res) }).catch((res) => { console.log(res) })

 簡單記憶:resolve 返回,之后代碼走then,reject返回,那么代碼就會走catch。

我們可以把執行GetUserEntity方法之后要執行的代碼放在then中,如果GetUserEntity中發起的請求出錯那么程序就會通過reject返回信息,

那么我們可以再catch中做相應的處理。

 

參考:https://www.cnblogs.com/zhihuama/articles/9143954.html

          https://blog.csdn.net/qq_32786873/article/details/72179601

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM