上傳多張圖片

html中標籤:html

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

uploadFiles函數api

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 接口,修改請求類型,上傳圖片接口是不須要序列化的。app

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

最後瀏覽器查看結果:函數

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

注意:post

其餘接口若是須要序列化:url

import QS form 'qs'
export const api2 = data => post('api/api2',QS.stringify(data))
相關文章
相關標籤/搜索