如何先把上传的文件存在前端,然后点击提交按钮的时候再

img

 <el-form-item label="选择文件" prop="messageContent" label-width="140px">
                <el-col :span="11">
                  <el-upload
                  class="upload-demo"
                  :data="datarul"
                  action=""
                  accept=".txt"
                  :on-change="onUploadChange"
                  :on-preview="handlePreview"
                  :on-remove="handleRemove"
                  :before-remove="beforeRemove"
                  :on-exceed="handleExceed"
                  :on-success="upok"
                  :on-progress="progress"
                  :auto-upload="false"
                  :show-file-list="false"
               
                >
                  <span slot="trigger" size="small" type="primary"  style="color:#0fa5f0">
                    点击选择
                  </span>
                    <div slot="tip" class="el-upload__tip">只能上传txt文件</div>
                </el-upload>
                </el-col>
              </el-form-item>

 //开始测试文本录入数据
    getcheckData1(addForm){
      let self = this;
      var param = {
      uId:this.addForm.uId,
      testMode:this.searchObj.testMode,
      file:this.result
      };
      self.$refs[addForm].validate((valid) => {
        if (valid) {
          self.addDataBOOL = false;
          self.$post("/dpcDevInterfaceTestTab/startTest2",param,self.addForm).then((data) => {
              if (data.code == 2000) {
                this.testList = data.data;
                self.$message({
                  duration:1500,
                  message:'测试成功',
                  type:'success'});
              } else if(data.code === 20036){
                self.$message({
                  duration:1500,
                  message:'数据解析失败!',
                  type:'warning'});
              }else{
                self.$message.warning();
              }
            })
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    onUploadChange(file) {
    // const isTXT = (file.raw.type === '.txt');
    const isLt1M = file.size / 1024 / 1024 < 1;
    //     if (!isTXT) {
    //   this.$message.error('只能上传txt文本文件!');
    //   return false;
    // }
    if (!isLt1M) {
      this.$message.error('上传文件大小不能超过 1MB!');
      return false;
    }
    var reader = new FileReader();
    reader.readAsDataURL(file.raw);
    reader.onload = function(e){
        console.info(this.result)
    }
},

现在的问题是 file这个文件上传不到后台了!怎么解决呢

上传文件的时候data中将设备uuid等内容加上一起上传。服务在接收文件的同时将内容也收了。

仔细看el的文档api before-upload