我们可以使用axios中的onDownloadProgress来加载API吗? [英] Can we use onDownloadProgress from axios for loading API?
本文介绍了我们可以使用axios中的onDownloadProgress来加载API吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要创建一个进度条,用于使用AXIOS在Reaction项目中加载API,为此我发现了"onDownloadProgress"函数。但是我不知道我们是可以用它来获取信息,比如加载百分比,还是只能用来下载文件?
所以我不确定是否可以使用此函数获取有关API加载的信息?
我尝试在代码中实现此函数:
componentWillMount() {
axios.get('https://guillaumeduclos.fr/jd-portfolio/wp-json/wp/v2/posts')
.then(response => {
axios.onDownloadProgress = (progressEvent) => {
let percentCompleted = Math.round( (progressEvent.loaded * 100) / progressEvent.total );
console.log(percentCompleted);
}
this.setState({
datas: response.data[0].acf.project_illustration.url,
loading: false
});
})
.catch(error => {
if(error.response) {
console.log(error.responderEnd);
}
});
}
不显示console.log()。感谢您的帮助。推荐答案
您需要将onDownloadProgress
作为选项传入。
由于长度可计算,它将打印出"Infinity"。
这里有一篇关于该问题的帖子:JQuery ajax progress via xhr
componentWillMount() {
axios.get('https://guillaumeduclos.fr/jd-portfolio/wp-json/wp/v2/posts', {
onDownloadProgress: (progressEvent) => {
let percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
console.log(progressEvent.lengthComputable)
console.log(percentCompleted);
}
})
.then((response) => {
this.setState({
datas: response.data[0].acf.project_illustration.url,
loading: false
})
}).catch(error => {
if (error.response) {
console.log(error.responderEnd);
}
});
}
这篇关于我们可以使用axios中的onDownloadProgress来加载API吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文