在Vue项目中,等待所有请求完成以后执行操作
在Vue项目中,等待所有请求完成以后执行操作
·
使用场景,首页渲染echarts数据,需等所有接口返回后再进行渲染。
axios.all([
this.interface1(mechanismId), // 请求①
this.interface2(mechanismId) // 请求②
]).then(() => {
this.getEchartData() // 执行数据渲染
})
这里我的请求是封装成方法的了(注意,方法中需将请求作为返回值)
interface1(mechanismId) {
let today = Date.parse(new Date())
return interface1IFS(mechanismId, today).then(result => {
if (result.data.code === 200) {
this.data1= result.data.data // 拿到接口1的数据
}
}).catch()
},
interface2(mechanismId) {
let today = Date.parse(new Date())
return interface2IFS(mechanismId,today).then(result => {
if (result.data.code === 200) {
this.data2= result.data.data // 拿到接口2的数据
}
}).catch()
},
getEchartData () {
Console.log(‘拿到了数据啦,可以渲染啦~’)
}
export function interface1IFS(mechanismId, startTime) {
return axios({method: 'get', url: '/interface/interface1?mechanismId=' + mechanismId + '&startTime=' + startTime, allowCredentials: true})
}
export function interface2IFS(mechanismId, endTime) {
let data = new FormData()
data.append(mechanismId, mechanismId)
data.append(endTime, endTime)
return axios({method: 'post', url: '/interface/interface2d', data: data, allowCredentials: true})
}
更多推荐
已为社区贡献1条内容
所有评论(0)