一、Promise對(duì)象
承諾一定會(huì)實(shí)現(xiàn)抚笔,更簡(jiǎn)單的處理異步請(qǐng)求扶认。同時(shí)更加方便使用鏈?zhǔn)秸{(diào)用。
缺點(diǎn):Promise對(duì)象狀態(tài)不會(huì)改變殊橙,Promise操作不可中斷辐宾,只要執(zhí)行無(wú)法取消,也無(wú)法確定內(nèi)部執(zhí)行的狀態(tài)膨蛮。
1.語(yǔ)法
new Promise( function(resolve, reject) {...} /* executor */ );
2.狀態(tài)
- pending:初始狀態(tài)
- fulfilled:操作成功完成
- rejected:操作失敗
3.方法
Promise.prototype.catch(onRejected)
添加一個(gè)否定(rejection) 回調(diào)到當(dāng)前 promise, 返回一個(gè)新的promise叠纹。如果這個(gè)回調(diào)被調(diào)用,新 promise 將以它的返回值來(lái)resolve敞葛,否則如果當(dāng)前promise 進(jìn)入fulfilled狀態(tài)誉察,則以當(dāng)前promise的肯定結(jié)果作為新promise的肯定結(jié)果∪切常——MDN
Promise.prototype.then(onFulfilled,onRejected)
添加肯定和否定回調(diào)到當(dāng)前 promise, 返回一個(gè)新的 promise, 將以回調(diào)的返回值 來(lái)resolve持偏。——MDN
二氨肌、Promise使用(三個(gè)表格聯(lián)動(dòng))
先是掉第一個(gè)接口數(shù)據(jù)鸿秆,拿到數(shù)據(jù)的第一個(gè)數(shù)據(jù)后作為參數(shù)掉第二個(gè)接口,在拿到數(shù)據(jù)后怎囚,作為第三個(gè)參數(shù)掉第三個(gè)接口卿叽。
重點(diǎn):使用鏈?zhǔn)秸{(diào)用
// 鏈?zhǔn)秸{(diào)用的前提要return Promise對(duì)象,返回后才能使用then()方法調(diào)用到
getProviceList: ({commit, state}, params) => {
return API.getProviceListApi(params).then(res => {
commit(types.HIDE_PAGE_LOADING)
commit(types.GET_PROVICE_LIST, res.data)
return res.data
}, function () {
console.log('錯(cuò)誤')
})
}
// 三個(gè)接口鏈?zhǔn)秸{(diào)用
this.getNormalList()// 第一個(gè)
.then((res) => {//第二個(gè)
this.modelId = res[0].MODELID
this.getNormalProvinceList({
'mobileCode': this.modelId
})
.then((res) => {// 第三個(gè)
this.provinceId = res[0].ID
this.getNormalDataList({
'provinceCode': this.provinceId,
'mobileCode': this.modelId
})
})
})
效果圖