vue中实现带参带请求头手动上传

1、直接代码如下

  <template>
  <div>
    <div class="formContent">
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item label="预出账月份">
          <div class="block">
            <el-date-picker 
             v-model="formInline.exportMonth" 
             type="month" 
             placeholder="选择月"
              value-format="yyyy-MM-dd" 
           >  
          </el-date-picker> 
         </div> 
       </el-form-item> 
       <el-form-item label="调账数据">
          <el-upload 
           class="upload-demo" 
           ref="upload" 
           :action="exportUrl" 
           :on-success="onSuccess" 
           :auto-upload="false"
            :before-upload="beforeUpload"
            :data="uploadData"
            name="file"
            :headers="headers"
          > 
           <el-button slot="trigger" size="medium"
             type="primary" plain  
            >选取文件</el-button> 
           <el-button
              class="confirmBtn" 
             size="medium"
              type="success" 
             @click="submitUpload"
              >确认导入</el-button > 
         </el-upload> 
       </el-form-item> 
     </el-form> 
   </div> 
 </div>
</template>
<script>
export default {
 data() { 
   return { 
     formInline: { 
       exportMonth: "", 
     }, 
     exportUrl: "",
      uploadData: {}, 
     headers: { 
       token: "",  
    }, 
   }; 
 }, 
 created() { 
   this.headers.token = `请求头要带的token`;
    this.exportUrl = "上传地址"; 
 }, 
 methods: { 
   //上传之前需要携带的参数 
   beforeUpload(file) { 
     this.uploadData = { 
       month: this.formInline.exportMonth,
      }; 
     let promise = new Promise((resolve) => { 
       this.$nextTick(function () { 
         resolve(true); 
       });
      }); 
     return promise; 
   }, 
   //上传结果 
   onSuccess(res, file, fileList) { 
     if (res.code == 0) { 
       this.$message({ 
         type: "success", 
         message: "操作成功", 
       }); 
     } else { 
       this.$message({ 
         type: "warning", 
         message: res.msg,
        });
      } 
     this.$refs.upload.clearFiles();
    }, 
   //提交上传 
   submitUpload() {
      this.$refs.upload.submit(); 
   }, 
 },
};
</script>
<style scoped>
.formContent{
    display: flex;
    flex-direction: row;
}
</style>