ios循环调用同一个接口_详解vue中使用axios对同一个接口连续请求导致返回数据混乱的问题...

业务上出现一个问题：如果连续对同一个接口发出请求，参数不同，有时候先请求的比后请求的返回数据慢，导致数据顺序混乱，或者数据被覆盖的问题，所以需要控制请求的顺序。

解决方法:

1.直接跟后台沟通，将所有参数放到数组里后台统一接收并返回所有数据再由前端进行数据的拆分使用。

2.对于出现返回的数据混乱问题。

假设场景： 页面中需要对三个部门请求对应的部门人员，三个部门人员的数据为一个二维数组，连续发送请求，但由于返回数据的顺序不定，导致数组中的数据顺序不是按照部门的顺序。

解决方法：使用promise.all + axios。

//获取部门人员的请求

getDepartPerson (departData) {

let that = this

return new Promise(function(resolve,reject) {

that.$axios({

method: 'get',

url: ...,

params: {

...

}

}).then(res => {

const data = res.data.map(item => {

return {

value: item.userId,

label: item.userName

}

})

resolve(data)

})

})

<