圖片上傳

<input id="upload1" class="upload1" name="file" type="file" accept="image/*" @change="fileImageFront" />

一般type="file"的原生樣式不是我們想要的 ，所以給opcity=0後用自己的樣式覆蓋。

     fileImageFront(e) {
        let files = e.target.files || e.dataTransfer.files;
        if (!files.length) return;
        this.createImage(files, e);
      },

      // 上傳圖片
      createImage(files, e) {
        let self = this;
        var img_type = files[0].type

        if (files[0].size > 25 * 1024 * 1024) {
          self.$toast("文件過大，請重新上傳")
          return false
        }

        if (img_type.toLowerCase() != "image/png" && img_type.toLowerCase() != "image/jpg" && img_type.toLowerCase() != "image/jpeg") {
          self.$toast("請上傳png、jpg、jpeg格式的圖片")
          return false
        }

        let formData = new FormData()
        formData.append('txt', files[0]);
        self.$post("/xxxxx",formData).then(function (response) {
          if(response.statue==1){
            self.$toast({message:'上傳成功',duration:1000})
            self.userUpPic.push(response.data.imageurl);   //該值是一個對象，第一個鍵值對傳給後臺，第二個值用於頁面顯示
            self.userUpPicLen=self.userUpPic.length;
            self.sendNet.push(response.data.name);
          }
        });
//        uploadeFile(formData).then(function(res) {
//          if (res.status == 1) {
//            self.$toast(res.msg)
//            self.userInfo.head_img = res.url
//          }
//        })
        // 清空文件上傳控件的值
        e.target.value = null;
      },