vue中上传文件之multipart/form-data

首先在项目里用了拦截器的，由于拦截器会将传递的参数转成对象，所以你i提交的时候会发现multipart/form-data或转变成application/json

其次关于input的文件上传是需要一个非常纯净的axios的，于是我就在main.js里重新挂载了一个axios

//main.js
//自定义
var instance = axios.create({
  baseURL:,
  timeout:5000,
  headers:{"Content-Type":"multipart/form-data"}
});
 
Vue.prototype.axios = axios;
Vue.prototype.instance=instance;

//main.js //自定义 var instance = axios.create({ baseURL:, timeout:5000, headers:{"Content-Type":"multipart/form-data"} }); Vue.prototype.axios = axios; Vue.prototype.instance=instance;

在组件中上传代码

var img_file = this.$refs.inputs;
            var formData = new FormData(img_file);
            var fileObj = img_file.files[0];
            console.log(formData)
            formData.append("dsc","dsc");
            formData.append("file",fileObj);
            console.log(fileObj)
            this.instance.post(url,formData).then(

var img_file = this.$refs.inputs; var formData = new FormData(img_file); var fileObj = img_file.files[0]; console.log(formData) formData.append("dsc","dsc"); formData.append("file",fileObj); console.log(fileObj) this.instance.post(url,formData).then(

首先在项目里用了拦截器的，由于拦截器会将传递的参数转成对象，所以你i提交的时候会发现multipart/form-data或转变成application/json 其次关于input的文件上传是需要一个非常纯净的axios的，于是我就在main.js里重新挂载了一个axios //main.js //自定义 var instance = axios.create({ baseURL:, timeout:5000, headers:{"Content-Type":"multipart/form-data"} }); Vue.prototype.axios = axios; Vue.prototype.instance=instance; 在组件中上传代码 var img_file = this.$refs.inputs; var formData = new FormData(img_file); var fileObj = img_file.files[0]; console.log(formData) formData.append("dsc","dsc"); formData.append("file",fileObj); console.log(fileObj) this.instance.post(url,formData).then(