• element ui 上传控件携带参数到后端


    1.携带固定参数:

    2.携带不固定参数:

          <el-row> 
            <el-col :span="24">
              <el-upload
                :multiple="false"
                :show-file-list="false"
                :on-success="f_handleImageSuccess"
                :before-upload="f_HandleImageBefore"
                drag
                action=""
                :http-request="f_handleUploadForm"
                :auto-upload="true"
                :headers="importHeaders"
              >
                <i class="el-icon-upload" style="margin:10px 0px 0px 0px;" />
                <div class="el-upload__text">
                  <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
                  <div slot="tip" class="el-upload__tip">只能上传xls/xlsx/et文件,且不超过200MB</div>
                </div>
              </el-upload>
            </el-col> 
          </el-row>
    

     // 文件格式及文件大小验证
        f_HandleImageBefore(file) {
          let isJPG = false;
          if (file.name.indexOf('.xls') > -1 || file.name.indexOf('.xlsx') > -1 || file.name.indexOf('.et') > -1) { isJPG = true; }
          let isLt2M = file.size / 1024 / 1024 < 200;
          if (!isJPG) {
            this.$message.error('上传文件只能是XLS/XLSX/ET格式!');
          }
          if (!isLt2M) {
            this.$message.error('上传文件大小不能超过 200MB!');
          }
          return isJPG && isLt2M;
        },
        f_handleImageSuccess(file) {
          this.meternos = '';
          if (file.success) {
            this.$message({ showClose: true, message: '附件上传成功!', type: 'success' }); 
    		    // this.$emit('queryList');		
          } else {
            this.$message({ showClose: true, message: file.message, type: 'error' });
          }
        },
        // 上传并携带参数
        f_handleUploadForm(param)
        {
          let formData = new FormData()
          // 在formData中加入我们需要的参数
          formData.append('file', param.file) //上传的文件
          formData.append('poid', this.fileUpload.poid) //参数:出库单号
        	formData.append('type', this.fileUpload.type) //参数:类型
          api_StockOutOverdueUploadFile(formData).then((response) => {
              if (response.success === true) {
                this.$message({ showClose: true, message: '附件上传成功!', type: 'success' }); 
              }
            });
        }
    
    • js里面的请求方法:
    //附件上传
    export function api_StockOutOverdueUploadFile(data) {
      return request({
        url: '/maobao.mom.wms/v' + apiversion + '/purchaseorderdetail/StockOutOverdueUploadFile',
        method: 'post',
        data
      });
    }
    


    部分代码如下:

            [HttpPost, Route("StockOutOverdueUploadFile"), SwaggerFileUpload]
            [DisableRequestSizeLimit]
            public async Task<IActionResult> StockOutOverdueUploadFile()
            {
                //获取所有上传文件
                var files = Request.Form.Files;// 接收上传文件
                var poid = Request.Form["poid"].ToString();//接收传递的参数:出库单号
                var type = Request.Form["type"].ToString();//接收传递的参数:类型
            }
    
    
  • 相关阅读:
    redis之(十二)redis数据的持久化
    redis之(十一)redis实现缓存的功能
    redis之(十)redis实现消息中间件的功能
    redis之(九)redis的事务机制
    SQL关于IN和EXISTS的用法和区别的比较
    mysql explain extra理解
    mysql explain rows理解
    mysql explain中key_len值的说明
    redis常见重要性能指标数据分析和相关问题解决方案
    java.lang.UnsupportedOperationException解决方法!!!
  • 原文地址:https://www.cnblogs.com/newcapecjmc/p/16278057.html
Copyright © 2020-2023  润新知