1. Comece a usar forEach para solicitar e descubra que a interface de solicitação errada não pode ser capturada. Se houver um erro, o loop continuará a ser executado.
Hoje recebi uma solicitação que exige percorrer uma lista e solicitar a interface da API para cada linha (para atualizar os dados). A solicitação não pode ser assíncrona ou simultânea. A interface da API precisa ser classificada de forma síncrona (ou seja, enfileirada uma por um), e os dados relevantes podem ser processados de maneira ordenada.
let refreshParam = []; // 获取用户的设备列表
refreshParam.forEach( (param,index)=>{
console.log("refreshParam[index]")
console.log(refreshParam[index])
if(index <= refreshIndex){
// 提交刷新设备
this.$http
.post(this.$apis.bizFreshauths,param)
.then(resp => {
console.log("提交刷新后返回结果")
console.log(resp)
let code = resp.returnInfo.code;
if (code == 0) {
//console.log('成功了');
setTimeout(() => {
// 测试机测试不用刷新页面
//this.$emit("refreshFrozenList")
// 判断是否最后一个设备刷新成功
if(index == refreshIndex){
uni.showToast({
title: '刷新设备成功!',
icon:'../../../static/checkBreakdown/ic_progress_ok.png',
duration: 3000
});
}
},2000)
} else {
this.$util.feeback.showToast({title:"温馨提示 :设备号"+refreshParam[index].servid+"刷新授权提交失败"})
return;
}
})
.catch(error => {
this.$util.feeback.showToast({title:"温馨提示 :刷新授权提交失败"})
return;
});
}
});
2. Mais tarde, mude para async+await+Promise para processamento.
A armadilha encontrada aqui é que new Promise((resolve, rejeitar) => {isto contém o método de pós-envio}) não é usado para converter o valor retornado em um objeto objeto para aceitação. O corpo do método que causou o loop nunca recebeu dados.
async clickRefreshParams(parameter) {
let refreshParam = []; // 获取用户的设备列表
let servDetailsList = JSON.parse(JSON.stringify(this.serv.servDetails)); // 设备基础信息
/* console.log("servDetailsList")
console.log(servDetailsList) */
// 重构设备数据列表
servDetailsList.forEach((DetailsList, index) => {
refreshParam.push({
'servid': DetailsList.servid,
'permark': DetailsList.permark,
'patchid': DetailsList.patchid,
'whladdr': DetailsList.addr,
'keyno': DetailsList.keyno,
'logicstbno': DetailsList.stbno,
'houseid': DetailsList.houseid,
'custid': this.custInfo.custid,
'name': this.custInfo.pwdcustname,
'areaid': DetailsList.areaid,
'descrip': "", // 备注
})
});
// 循环刷新设备
//console.log(refreshParam.length)
let refreshIndex = refreshParam.length - 1; // 刷新次数索引
// 用forEach的方式刷新太快,无法通过延时知道那个接口失败了。现在改用循环+async+await+Promise的方式进行设备刷新。
let refreshSum = 0; // 刷新次数
for (let i = 0; i <= refreshIndex; i++) {
let param = refreshParam[i];
refreshSum = i;
let refreshResultValue = await this.commitRefresh(param, refreshIndex);
if (this.refreshResultValue.returnInfo.code == 0) {
// 判断是否全部设备刷新完成
if (refreshSum == refreshIndex) {
uni.showToast({
title: '刷新设备成功!',
icon: 'success',
duration: 2000
});
}
continue;
} else {
uni.showToast({
title: '设备号:' + refreshParam[refreshSum].servid + ' 刷新失败!',
icon: 'error',
duration: 2000
});
return;
}
}
},
// api提交刷新方法
commitRefresh(param, refreshIndex) {
var refreshResult = this
return new Promise((resolve, reject) => {
// 提交刷新设备
this.$http
.post(this.$apis.bizFreshauth, param)
.then(resp => {
console.log("提交刷新后返回结果")
console.log(resp)
this.refreshResultValue = resp;
let code = resp.returnInfo.code;
if (code == 0) {
// 判断是否最后一个设备刷新成功
//if(i == refreshIndex){
//}
}
resolve()
}).catch((res) => {
this.$util.feeback.showToast({
title: '温馨提示 :设备号' + refreshParam[refreshIndex].servid + '调用刷新接口失败!'
})
reject()
})
})
},
3. async + await +new Promise() chama de forma assíncrona o método da interface da API e o corpo do método
async 方法名(parameter) {
let 返回结果集 = await this.commitRefresh(param, refreshIndex);
if (this.返回结果集.returnInfo.code == 0) {
// 判断是否全部设备刷新完成
if (refreshSum == refreshIndex) {
uni.showToast({
title: '刷新成功!',
icon: 'success',
duration: 2000
});
}
continue;
} else {
uni.showToast({
title: '刷新失败!',
icon: 'error',
duration: 2000
});
return;
}
}
},
// api提交刷新方法
commitRefresh(param, refreshIndex) {
// resolve() 成功的放回值
// reject() 失败的放回值
// 返回的结果必须是new Promise()包装的对象,否则无法获取放回值对象
return new Promise((resolve, reject) => {
this.$http
.post(url, param)
.then(resp => {
resolve()
}).catch((res) => {
reject()
})
})
},
Se você precisar entender o método async+await+promise em detalhes, você pode ver
ES6 --- novo método de uso Promise()_S XiaoxiaoS sorriso quadridimensional-CSDN blog_nova promessa