求教axios结合throttle的写法

Question

使用场景：vue+axios,弹窗点击按钮>发送请求>弹窗关闭，遇到问题：连续点击按钮，在弹窗关闭前会发送多个相同的接口，解决方案：点击时，给按钮一个disabled的标记来控制按钮问题：1.如果click事件挂载在div，该怎么解决（div无disabled属性）2.考虑采用axios结合throttle的思想，如何在全局层面上改造axios

Answer 1

data(){
return{
requesting:false
}
},
methods:{
onButtonClick(){
if(!this.requesting){
request().then(()=>{this.requesting=false})
this.requesting=true
}
}
}
最简单的方法，在弹框按钮回调函数里判断下是否已经发送了请求
                            

Answer 2

要全局修改axios的话，可以参考楼上的，把请求标记requesting，存在全局状态中，如果有用vuex就存在state里面，然后通过axios的拦截器，在请求之前和请求结束后，改变requesting。
但是这种做法的话，你只能同时进行一个请求，如果遇到要同时进行两个以前的请求，就会失败。
用户体验比较好的的做法是请求的时候，弹出一个类似加载中的动画浮层，让用户无法多次点击按钮，请求结束后隐藏。