带有axios的进度栏

问题描述

我必须使用进度条显示文件的上传状态.我正在使用 axios 发出http请求.我从他们的github页面上跟随了该示例 https://github.com/mzabriskie/axios/blob/master/examples/upload/index.html

I have to display the upload status of the file using a Progress Bar. I am using axios to make http requests. I followed the example from their github page https://github.com/mzabriskie/axios/blob/master/examples/upload/index.html

我的代码如下:

this.store().then(() => {
    var form = new FormData();
        form.append('video', this.file);
        form.append('uid', this.uid);

        axios.post('/upload', form, {
            progress: (progressEvent) => {
                    if (progressEvent.lengthComputable) {
                       console.log(progressEvent.loaded + ' ' + progressEvent.total);
                       this.updateProgressBarValue(progressEvent);
                    }
           }
       })
});

但是，它根本不执行 console.log(progressEvent.loaded +''+ progressEvent.total); ，也不调用 this.updateProgressBarValue(progressEvent);

However, it is not executing the console.log(progressEvent.loaded + ' ' + progressEvent.total); at all nor is it calling this.updateProgressBarValue(progressEvent);

我该如何解决?

推荐答案

我找到了答案.事件的名称是 onUploadProgress ，而我使用的是 progress

I found the answer. The name of the event is onUploadProgress and I was using progress

这篇关于带有axios的进度栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！