vue中的axios跨域是异步执行。
想要多个请求全部完成后再执行后面的逻辑可以使用**axios.all()**、**axios.spread()**
<template>
<div class="Test">
<el-button @click="get_button">点击</el-button>
</div>
</template>
<script>
export default {
name: 'Test',
components: {
},
mounted () {
},
methods: {
get_one_axios () {
let that = this
return that.$axios({
url: '/api/userInfo/getallusername',
method: 'get'
})
},
get_two_axios () {
let that = this
return that.$axios({
url: '/display/product-statistic-query/module/production-yield-info-by-work-order-id',
method: 'get',
params: {
workOrderId: '19440060'
}
})
},
get_three_axios () {
let that = this
return that.$axios({
url: '/display/trend-chart/warning-statistic-daily',
method: 'get',
params: {
startTime: '2021-06-02 00:00:00',
endTime: '2021-06-08 00:00:00',
classification: '模块工位良率'
}
})
},
get_button () {
let that = this
that.$axios.all([that.get_one_axios(), that.get_two_axios(), that.get_three_axios()]).then(that.$axios.spread(function (res1, res2, res3) {
console.log('完成')
console.log('res1:', res1)
console.log('res2:', res2)
console.log('res3:', res3)
}))
}
},
data () {
return {
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
</style>
运行: