我正在使用文件上传功能在Vue.js(使用axios)编写项目.
我需要在axios中发送POST请求之前实现一个动作：
axios.post('/upload',form,{
before: (xhr) => {
fileObject.xhr = xhr;
},onUploadProgress: (e) => {
//emit progress event etc...
console.log('upload progress: ' + e.loaded);
}
}).then((response) => {
console.log('finished...');
//emit finished event etc...
},() => {
console.log('error...');
//emit Failed event etc...
});
当然,除了之前的回调之外,一切都有效,因为它不是axios选项.从文档中,我知道在发送请求之前我应该使用拦截器来实现钩子.但我无法解决它.
编辑：
我想要一些类似于Vue的$http：
this.$http.post('/upload',{
before: (xhr) => {
fileObject.xhr = xhr;
//maybe do something else here
},progress: (e) => {
eventHub.$emit('progress',fileObject,e);
}
}).then((response) => {
eventHub.$emit('finished',fileObject);
},() => {
eventHub.$emit('Failed',fileObject);
})
解决方法
如果您需要在每个axios请求之前调用函数,则应使用
interceptor.
在你的情况下：
axios.interceptors.request.use((config) => {
fileObject.xhr = config;
return config;
});
axios.post('/upload',{ ... });
