vue upload 圖片上傳（file文件）

1.使用 vant 組件庫中 uploader 文件上傳 

前言：開發中遇到文件上傳，發現用formData傳給后台時，后台一直獲取不到file文件，然后記錄一下，希望能幫助到你。

使用：

<van-uploader v-model="fileList" :after-read="afterRead" :max-count="3" multiple></van-uploader>

注意：請求頭設置為

"Content-Type"]= "multipart/form-data"

方法：

data() {

    return {

　　fileList:[]

　　　}

}，

methods: {

//設置請求頭

setHeader() {

      this.headers["Content-Type"] = "multipart/form-data" ;

 },

afterRead(file){

      // 此時可以自行將文件上傳至服務器

      var formData = new FormData(); //構造一個 FormData，把后台需要發送的參數添加

      for (var i = 0; i < this.fileList.length; i++) {

            //注意：這里append進去的是File對象，而不是FileList對象

            formData.append("fileList", this.fileList[i].file);

        }

      const options = {

        method: "POST",

        url: this.$api.Uploadfile,

        headers:this.headers,

        data:formData

      };

      this.$http(options).then(res => {

        if (res.data.code === 200) {

          console.log("上傳成功",res.data)

        }

      })

    },

}