利用Promise實現數據多個請求加載完成時執行某個方法
在實際開發中常常有些業務的數據是來自多個接口的，因為ajax是異步，這樣就導致我們需要判斷是否請求到了數據然後在做其他的邏輯，在Promise沒有出現之前，通常我們的解決方法是，第一粗暴的改異步為同步，但這樣會造成阻塞，異步好像又失去了意義，第二也就是大家常用的解決辦法用回調既一個異步執行完成後在執行下一個請求，這樣看比第一種要好太多了，但是問題又來了，延遲延遲延遲，請求越多最後的那個請求延遲就會越嚴重，而且這樣請求多了之後邏輯就會變得很亂。。。痛苦不堪，還好es6帶來的Promise正好能解決這個東西，關於Promise具體詳情請百度，這裏大致只說三個東西，resolve, reject，Promise.all 對應成功執行，失敗執行，返回全部狀態，實例貼代碼 很容易理解。
const promist = new Promise((resolve, reject) => {
this.$http.jsonp(getRegionNameByIdApi, {params: {regionId: dqarr}}).then((res) => {
this.dqarr = res.body.data
resolve(res.body.data)
}, (err) => {
console.log(err)
})
})
const promist1 = new Promise((resolve, reject) => {
this.$http.jsonp(getPartnerNameByIdApi, {params: {partnerId: sharr}}).then((res) => {
this.sharr = res.body.data
resolve(res.body.data)
}, (err) => {
console.log(err)
})
})
Promise.all([promist, promist1]).then((resultList) => {
console.log(‘results:‘, resultList)
resultList[0].map((item) => {
this.tableData.map((val) => {
if (item.regionId === val.regionId) {
val.region_name = item.regionName
}
if (item.regionId === val.areaId) {
val.area_name = item.regionName
}
if (item.regionId === val.shopId) {
val.shopName = item.regionName
}
if (resultList[1][val.partnerId]) {
val.partner_name = resultList[1][val.partnerId]
}
})
})
this.$set(this.tableData, this.tableData)
})
創建promis和promist1並賦值一個Promise返回結果，在new一個新的Promise中 resolve代表成功要執行的方法，傳入異步響應的數據，這個新的Promise最後將返回一個數組 最後Promise.all傳入兩個參數，註意Promise.all只能傳入一個數組，在數組中放promis和promis1，在then中同樣返回一個數組，對應promis和promis1成功響應的數據
---------------------
作者：wzzehui
來源：CSDN
原文：https://blog.csdn.net/wzzehui/article/details/81179921
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！
利用Promise實現數據多個請求加載完成時執行某個方法