for (let i = 0; i < this.code.length; i++) { // 车位数 this.$axios({ url: "/parking/getParkData", method: "get", params: { parkname: this.code[i], currPage: "0", pageNum: "4", }, }).then((res) => { // console.log(res) this.parkData[i + 1].push(this.code[i] + "区车位"); this.parkData[i + 1].push(res.data.total); this.handleParkEcharts(); }); // 已分配量 this.$axios({ url: "/parking/getParkData", method: "get", params: { parkname: this.code[i], parkstatus: "1", currPage: "0", pageNum: "4", }, }).then((res) => { // console.log(res) this.parkData[i + 1].push(res.data.total); this.handleParkEcharts(); });
时间: 2024-02-10 13:09:05 浏览: 74
react PC端项目构建TS,react@18.2.0+antd+vite+axios+redux+sass+ts
上面的代码中,使用了 for 循环遍历 this.code 数组中的每一个元素,并且在每一次循环中都发送了两个请求,这可能会导致请求的并发量比较大,从而影响系统的性能。如果希望降低请求的并发量,可以使用 Promise.all 方法。下面是一个使用 Promise.all 方法的例子:
```javascript
const promises = [];
for (let i = 0; i < this.code.length; i++) {
const promise1 = this.$axios.get('/parking/getParkData', {
params: {
parkname: this.code[i],
currPage: '0',
pageNum: '4',
},
});
const promise2 = this.$axios.get('/parking/getParkData', {
params: {
parkname: this.code[i],
parkstatus: '1',
currPage: '0',
pageNum: '4',
},
});
promises.push(promise1, promise2);
}
Promise.all(promises).then((responses) => {
for (let i = 0; i < responses.length; i += 2) {
const parkingName = this.code[i / 2] + '区车位';
const total = responses[i].data.total;
const allocated = responses[i + 1].data.total;
this.parkData[i / 2 + 1].push(parkingName, total, allocated);
}
this.handleParkEcharts();
}).catch((error) => {
console.error(error);
});
```
在该例子中,首先定义了一个 promises 数组来存放所有的 Promise 对象。然后,在 for 循环中,使用 this.$axios.get 方法发送两个请求,并将返回的 Promise 对象存入 promises 数组中。接着,使用 Promise.all 方法等待所有 Promise 对象完成,并使用 then 方法来处理所有请求的结果。在 then 方法中,使用 for 循环遍历所有请求的结果,并将结果更新到 this.parkData 数组中。最后,调用 handleParkEcharts 方法来更新图表。如果出现错误,可以使用 catch 方法来处理。
阅读全文