html中标签:

<input type="file" @change="uploadFiles" multiple>

uploadFiles函数

uploadFiles(e){
        let formData = new FormData()
        let _files = e.target.files
        for (let i = 0; i < _files.length; i++) {
          if (_files[i].size / 1024 / 1024 > 2) {
            return
          }
          formData.append('multipartFiles', _files[i], _files[i].name)
        }

        upload(formData).then(() => {
        })
}

api post封装:

export function post(url,params,config){
  return new Promise((resolve,reject)=>{
    service.post(url,prams,config)
      .then((res)=>{
        resolve(res.data)
      }).catch(err=>{
        reject(err.data)
    })
  })
}

upload 接口,修改请求类型,上传图片接口是不需要序列化的。

export const upload = params => {
  return post('api/upload',params,{
    header:{
      'Content-Type':'applications/form-data'
    }
  })
}

最后浏览器查看结果:

Snipaste_2020-06-04_11-17-52.png

注意:

其他接口如果需要序列化:

import QS form 'qs'
export const api2 = data => post('api/api2',QS.stringify(data))

流莹离
9 声望4 粉丝

拼命往前,仗剑天涯