vue上传formdata格式数据(axioes)

vue.js 上传formData数据到后台(其他js类似)

 

调用方式还是通过post方式

请求类型要设置一下

config.headers["content-type"] = "multipart/form-data";

 

然后上传的时候分2种情况

1、后台可以直接解析formData格式的，直接创建一个FormData对象提交到后台

let forms = new FormData()

forms.append('name', 'test')
forms.append('age', ''XXX')

let files = document.getElementById('file').files

// 上传多个文件
Array.from(files).forEach(item => {
    forms.append('file', item)
})

axios({
  method: 'post',
  url: url,
  data:forms
})

2、后台不能直接解析formData格式的，要把文件和其他参数拆开提交

      <input @change="uploadclick" type="file" accept="image/*" style="display:none"  />    

       uploadclick: function(e) {    

        var file = e.target.files[0]
文件  let formdata = new FormData();
          formdata.append("dataFile", file);
参数  let params = {
          name: 'XXX'
        }

}

这里axioes封装了

 http({
      method: "post",
      url: url,
      formdata,
      params
    })