vue 中上傳文件帶參數eg

在element  ui中上傳文件時,使用FormData來上傳

如下

<el-upload
                    id="importFile"
                    class="upload-demo"
                    :limit="1"
                    ref="uploads"
                    :file-list="fileList"
                    :http-request="uploadFile"
                    :before-upload="beforeAvatarUpload"
                    :on-change="imageChange                              
                    :auto-upload="false"
                    :action="'xxxx/api/DataManagement/xxx'"
                    :data="uploadData"
                    
                    :on-success="uploadmodellist"
                  >





//method  中的方法


      uploadFile(param){
         var fileObj = param.file;
        var form = new FormData();   //在創建FormData對象時指定表單的元素  我們需要傳的參數

        form.append("file", param.file);
       form.append("monitorUnitReportId", this.MonitorUnitReportId);
       axios({
         method: 'POST',
         url: 'http://xxxxx/api/DataManagement/xxxx',
         headers: {
           'Content-Type': 'multipart/form-data'
         },
         data:form
       }).then(res => {
         res
         debugger
         if(res.data.msgCode == '1'){
           this.$message({
             type:'success',
             message:res.data.msgDesc
           })
           this.attachMentCode = res.data.data.attachmentCode//附件編碼
           this.attachmentId = res.data.data.attachmentId//標誌
         } 
       })
     },
     imageChange(file){
       this.uploadname=file.name.substring(0,file.name.indexOf("."))
      
     },
    beforeAvatarUpload(file) {
   

      
        const isM= file.type === 'application/msword';
        const isLt50M = file.size / 1024 / 1024 < 50;
        

        if (!isM) {
          this.$message.error('上傳的附件只能是 doc 格式!');
        }
        if (!isLt50M) {
          this.$message.error('上傳的附件圖片大小不能超過 50MB!');
        }
        return isM && isLt50M;

         
      },

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章