当前位置: 首页 > news >正文

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();//接收传递的参数:类型
        }

 

http://www.lryc.cn/news/96503.html

相关文章:

  • scrapy分布式+指纹去重原理
  • FileHub使用教程:Github Token获取步骤,使用快人一步
  • 嵌入式开发:单片机嵌入式Linux学习路径
  • Libvirt的virsh工具常用命令
  • 高斯消元解异或方程组写法
  • 前端 mock 数据的几种方式
  • 【GO】go语言入门实战 —— 猜数字游戏
  • opencv-25 图像几何变换04- 透视 cv2.warpPerspective()
  • 视频讲解Codeforces Round 887 (Div. 2)(A--C)
  • 【团队协作开发】将Gitee项目导入到本地IDEA中出现根目录不完整的问题解决(已解决)
  • vue-pdf 单列显示多个pdf页面
  • 2023年FPGA好就业吗?
  • 【业务功能篇52】Springboot+mybatis mysql开启批量执行sql参数 allowMultiQueries=true
  • StableDiffusion 换脸实现
  • 直播平台源码开发提高直播质量的关键:视频编码和解码技术
  • 如何使用 PHP 更新数据到数据库?
  • NLP masked_tokens[]、token_masks[]是什么?
  • aoa_android工程编译注意事项
  • java篇 类的进阶0x06:可见性修饰符(访问修饰符)
  • Java 贪心算法经典问题解决
  • 所有docker命令无效,解决办法
  • 系列一、创建者模式
  • 数据库系列:覆盖索引和规避回表
  • java Spring Boot上线运维 启动jar时控制台调整零时变量
  • java后端校验
  • PowerPoint如何修改“默认保存路径”?
  • 【PMP】有没有项目经理能看得懂这九张图?求挑战
  • ES6学习记录—自己记录一直更新版
  • linux操作gpio的一些记录
  • 目前新能源汽车充电桩的发展受到哪些不利因素的影响?