以下这段请求代码有3个小问题?
instance.interceptors.request.use(config => {
// 添加全局的loading...
if (!Object.keys(this.queue).length) {
// Spin.show() // 不建议开启,因为界面不友好
}
this.queue[url] = true
return config
}, error => {
return Promise.reject(error)
})
// 响应拦截
instance.interceptors.response.use(res => {
this.destroy(url)
const { data, status } = res
return { data, status }
}, error => {
this.destroy(url)
let errorInfo = error.response
if (!errorInfo) {
const { request: { statusText, status }, config } = JSON.parse(JSON.stringify(error))
errorInfo = {
statusText,
status,
request: { responseURL: config.url }
}
}
addErrorLog(errorInfo)
return Promise.reject(error)
})
destory函数:
destroy (url) {
delete this.queue[url]
if (!Object.keys(this.queue).length) {
// Spin.hide()
}
}
- queue是干什么用的 只是添加了又删除 维护这个队列我不知道是为什么
- 为什么要return Promise.reject(error)而不是return error?
- 为什么用Object.keys(this.queue).length来判断长度 和直接用queue.length又什么区别?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
this.queue
的实际作用是:标记当前是否有未完成的请求,如果还有,就显示加载动画(也就是执行Spin.show()
);url
不是数字的话,queue[url] = true
并不会影响queue.length
的值,所以不能通过length
来判断有没有内容,只能用Object.keys
枚举所有键值来判断。当然,代码里的这个实现不是很优雅。因为它使用
url
作为键名,如果有两个同url
的请求的话,后一个会把前一个覆盖掉,导致加载提示提前关闭;返回的Promise
也有可能造成内存无法回收。this.queue
的实现应当采用数组,更简单的方法是直接对请求数量进行计数,计数为0
的时候关闭加载提示。先回答第三个问题吧
destory函数
里有delete
操作。如果this.queue
是个数组,会导致this.queue
变成稀疏数组。所以Object.keys(this.queue).length
和this.queue.length
是有区别的: