layui upload 组件 data 参数传递至后端的解决方案

作者:星河

时间:2026-10-31

浏览:111

本文详细解析了layui框架中upload组件在上传文件时,如何通过before回调函数正确传递自定义data参数至后端。针对直接配置data无效的情况,提供了在before中使用this.data结合JSON.stringify与parse进行格式处理的解决方案,确保参数能正确传递至后端接口。

文章目录

layui 框架的upload上传文件的data参数传到后端的方法

由于特定的实现机制,在初始化 upload.render 时直接配置 data:{id:"sss"} 往往无法将参数成功传递到后台。

经过大量测试及查阅网上相关方法,发现需要进行特殊处理:

1、如果直接给{id:"sss"}无效,但如果在before里,this.data.id="sss" 却是有效。

2、经过多次测试及理解,因该是data接收的是严紧的JSON格式如{"ID":"sss"}

3、但这个是公用的上传EXCEl界面,所以data参数是由父窗体传过来的,所以独立进行了JSON.stringify(jsonParams);后再JSON.parse()。

4、成功了,这样参数与其它的data可以按习惯去设置就可以了。

before: function (obj) {
                    jsonParams.action = "CommonImportExcel";
                    let ss = JSON.stringify(jsonParams);
                    this.data = JSON.parse(ss);                  
                    //console.log(jsonParams);
                }
 
data传参如:
jsonParams={ID:112,name:"ssss"}

layui upload 上传文件携带参数

前言 layui上传文件时,有时候需要往后台多传递一些自定义的参数

语法

before: function(obj) {
    this.data = {"xxx": "xxx"};
 }

例子 js

before: function (obj) {
            $("#importExcelMsg").text("数据导入中,请稍候...");
            var data = table.checkStatus('reloadSearch2').data;
            if (data.length > 0) {
                for (var i in data) {
                    var roleId = data[i].id;
                    roleIds += roleId + ",";
                }
                roleIds = roleIds.substring(0, roleIds.length - 1);
            }
            this.data = {
                roleIds: roleIds,
                operatorNo: operator.operatorNo
            }
        }

java

@RequestMapping(value = "/importExcel", method = RequestMethod.POST)
    public ModelMap importExcel(@RequestParam("file") MultipartFile multipartFile, HttpServletRequest request,
                                String roleIds, String operatorNo) {
}

到此这篇关于layui 框架的upload上传文件的data参数传到后端的方法的文章就介绍到这了,更多相关layui upload上传data参数内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章