elementui el-upload 实现不自动上传功能，点击确定在上传，并且显示上传进度条功能

 

 

 

<div>
    <div class="row mt-2">
      <div class="col-lg-12">
        <label>agent文件名</label>
        <input
          v-model="addParams.newAgent"
          type="text"
          class="form-control"
          placeholder="如果直接上传文件则不需要填写文件名称"
        />
      </div>

      <div class="col-lg-12">
        <label>上传jar包</label>
        <el-upload
          ref="upload"
          name="filesList"
          action="/api/master/press/upgrade"
          :auto-upload="false"
          :file-list="filesList"
          :multiple="true"
          :data="addParams"
          :headers="header"
          :on-success="onSuccess"
          :on-error="onError"
        >
          <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
        </el-upload>
      </div>
    </div>

    <div class="row mt-2">
      <div class="col-lg-12">
        <b-button block variant="success" @click="uploadSubmit">确 认</b-button>
      </div>
    </div>
  </div>

uploadSubmit() {
      this.submitted = true;
      // this.$v.$touch();
      if (this.$refs.upload.uploadFiles.length < 1) {
        this.$message.warning("请选择文件");
        return false;
      }

      // let formData = new FormData();
      // formData.append("newAgent", this.addParams.newAgent);
      // console.log("newAgent:", this.addParams.newAgent);
      // formData.append("hostsList", this.addParams.hostsList);
      // console.log("hostsList:", this.addParams.hostsList);

      this.$refs.upload.submit();
    },

    onSuccess(response) {
      this.filesList.push(response);
      this.props.upgradeDialog = false;
    },

    onError(err) {
      this.showProgress = false;
      var errData = JSON.parse(err.message);
      this.$notify({
        title: "警告",
        message: errData.message,
        type: "warning",
      });
    },