前端传参时，后端接收不到参数

Question

   var tableIns = table.render({

            elem: '#tableId',
            id: 'id',
            url: 'SelectBom',
            height: 'full-90',
            toolbar: '#toolbarDemo',
            page: true,
            cols: cols,
            parseData: function (res) {
                var result;
                if (this.page.curr) {
                    result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                } else {
                    result = res.data.slice(0, this.limit);
                }
                return {
                    "code": res.code,
                    "msg": res.msg,
                    "count": res.count,
                    "data": result
                }
            }
        });

        form.on('submit(sreach)', function (data) {
            var searchData = data.field;  // 获取表单提交的数据
            searchData.commodityName = commodityNames.getValue('value'); // 获取选中的商品名称
            searchData.styleNumber = styleNumbers.getValue('value');   // 获取选中的款式
            var commodityName = commodityNames.getValue('value');
            var styleNumber = styleNumbers.getValue('value');

            var ssss="asd";
            console.log(commodityName)

            tableIns.reload({
                where:{
                    commodityName:JSON.stringify(commodityName),
                    styleNumber:JSON.stringify(styleNumber),
                    ssss:ssss
                }
            });
            return false;
        }); @ResponseBody
    @RequestMapping("/SelectBom")
    public LayuiDate<Pz_Bom> SelectBom(String[] commodityName, String[] styleNumber,String ssss) {
        log.info(ssss);
        log.info(Arrays.toString(commodityName));
        log.info(Arrays.toString(styleNumber));
        List<Pz_Bom> list = pzBomMapper.SelectBom(commodityName,styleNumber);
        LayuiDate<Pz_Bom> objectLayuiDate = new LayuiDate<>();
        objectLayuiDate.setCode(0);
        objectLayuiDate.setMsg("");
        objectLayuiDate.setCount(list.size());
        objectLayuiDate.setData(list);
        return objectLayuiDate;
    }后端打印格式为[["test1", "test2"]]，应该是[test1", "test2"]，前端格式["test1", "test2"]，如果前端不加JSON.stringify后端接收不到数据，测试的ssss不加JSON.stringify是可以接收到的，数组接收不到

Answer 1

以下回复参考：皆我百晓生、券券喵儿等免费微信小程序作答:

这个问题看起来是由于前端传递参数的方式和后端接收参数的方式不匹配导致的。前端使用JSON.stringify将数组转换为字符串格式，而后端默认接收的是以键值对形式的参数，这会导致问题。解决这个问题的关键在于让前端和后端的参数传递方式保持一致。你可以尝试以下方法来解决这个问题：

在前端代码中，你正在将查询参数（commodityName 和 styleNumber）通过 JSON.stringify 转换为字符串。虽然这可以在数据传输中保证格式的统一，但是在后端接收的时候需要进行相应的处理，以便能够正确解析这些数据。在你的后端代码中，尝试将这两个字符串参数（假设它们的格式是有效的JSON字符串）使用 JSON.parse() 解析回原始数组形式。下面是如何修改后端代码的示例：

@ResponseBody
@RequestMapping("/SelectBom")
public LayuiDate<Pz_Bom> SelectBom(@RequestParam String commodityNameJson, @RequestParam String styleNumberJson, String ssss) {
    String[] commodityName = JSON.parseArray(commodityNameJson, String.class); // 解析JSON字符串为数组
    String[] styleNumber = JSON.parseArray(styleNumberJson, String.class); // 解析JSON字符串为数组
    log.info(Arrays.toString(commodityName));
    log.info(Arrays.toString(styleNumber));
    List<Pz_Bom> list = pzBomMapper.SelectBom(commodityName, styleNumber);
    LayuiDate<Pz_Bom> objectLayuiDate = new LayuiDate<>();
    objectLayuiDate.setCode(0);
    objectLayuiDate.setMsg("");
    objectLayuiDate.setCount(list.size());
    objectLayuiDate.setData(list);
    return objectLayuiDate;
}

同时，确保前端在发送请求时，将数组参数转换为JSON字符串的格式，例如：

tableIns.reload({
    where: {
        commodityName: JSON.stringify(commodityName), // 将数组转换为JSON字符串格式传递
        styleNumber: JSON.stringify(styleNumber), // 将数组转换为JSON字符串格式传递
        ssss: ssss // 普通参数可以直接传递字符串格式即可
    }
});

这样前端和后端就可以正确地处理参数传递了。请注意，这里假设你使用的后端框架或库支持 JSON 的解析和序列化操作（如Fastjson等）。如果不支持，你可能需要引入相应的库或使用其他方式进行解析和序列化操作。