vue實現文件上傳

<!-- multiple多個文件上傳 accept文件類型-->
                <input
                  type="file"
                  @change="addFile"
                  ref="inputer"
                  accept="application/vnd.ms-powerpoint, application/vnd.openxmlformats-officedocument.presentationml.presentation, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/pdf"
                >
<p>支持文件格式：.ppt .pptx .doc .docx .pdf ，單個文件不能超過20M.</p>
--------------------------------------------------------------------
js
export default {
  data() {
    return {
             formData: new FormData(),
              file: {}, //文件數據  
            }
    }
}
    

methods: {
  //上傳文件
    addFile: function() {
      var _this = this;
      let inputDOM = this.$refs.inputer;
      // let oldLen = this.filLen;
      this.file = inputDOM.files[0];
      let len = this.file.length;
      let size = Math.floor(this.file.size / 1024);
      if (size > 20 * 1024 * 1024) {
        alert("請選擇20M以內的圖片！");
        return false;
      }
      this.formData.append("file", this.file);
      this.$http({
        method: "post",
        url: _this.HOST + api.upload,
        data: this.formData,
        headers: {
          "Content-Type": "multipart/form-data"
        }
      })
        .then(function(res) {
        })
        .catch(function(err) {
          console.log("新建分享", err);
        });

    },  
}
            

多個文件情況與單個文件其實一致的