Vue+element-ui Upload 的http-request自定义上传文件


 <el-upload
              ref="upload"
              :action="''"
              :on-change="changeResult"
              :http-request="requestUpload"
              :before-upload="beforeExcelUpload"
              :show-file-list="false"
              :multiple="false"
            >
              <el-button size="small" type="primary"> 导入分润表</el-button>
            </el-upload>

  

     // 上传文件
    changeResult(file, fileList) {
      this.form.file = file;
    },
    // 上传文件之前的钩子,上传前对文件的类型进行判断
    beforeExcelUpload(file) {
      const isExcel =
        file.name.split('.')[1] === 'xlsx' || file.name.split('.')[1] === 'xls';
      const isSize = file.size / 1024 / 1024 < 1;
      if (!isExcel) {
        this.$message({
          message: '只能上传xls或xlsx文件!',
          type: 'error',
        });
      }
      return isExcel;
    },
    //  覆盖默认上传行为
    requestUpload(params) {
      let fd = new FormData();
      fd.append('file', params.file);
      fd.append('FileName', params.file.name);
      fd.append('async', true);
      procQuery(this, {
        api: this.$api.financeProfitRecord,
        params: fd,
      }).then((res) => {
        //成功
        this.getList();
      });
    },

  


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM