vue 传递数组后端java接收问题(qs和json)

一、问题描述
1.通过qs.stringify()

      let array = [
        {"name":"a","id":1}, 
        {"name":"b","id":2}, 
        {"name":"c","id":3}
      ]
 
      let data = {
        array : array,
        number : 1,
        string : "STRING"
      }
 
      this.$axios({
        method: "post",
        url: "url",
        data: qs.stringify(data)
      }).then(res => {});
结果:

array[0][name]    a
array[0][id]    1
array[1][name]    b
array[1][id]    2
array[2][name]    c
array[2][id]    3
number    1
string    STRING
2.通过JSON.stringify()

 
      this.$axios({
        method: "post",
        url: "url",
        data: JSON.stringify(data)
      }).then(res => {});
结果:

{"array":[{"name":"a","id":1},{"name":"b","id":2},{"name":"c","id":3}],"number":1,"string":"STRING"}
如果java接收时使用的是List,那么使用qs来转化数组是会报错的,我测试是在spring mvc自动转配时。

而选择JSON来传化可以解决这个问题,可是JSON转化后端接收可能会出现数据为 [] 和为 0 的结果(原因还在寻找)

二、解决方法
1.将后端接收改为数组

2.将数组先用JSON转一次,再加入对象,再用qs来转

结果:

array    [{"name":"a","id":1},{"name":"b","id":2},{"name":"c","id":3}]
number    1
string    STRING

 

例如:

  let arr = {
                            "entity.productName": that.ruleForm.message,
              
                             entityListString: JSON.stringify(that.productCoreList),

                        };
                        console.log("arr", arr);
                        that.$axios
                        ({
                            method: "post",
                            url: "/api/add.do",
                            data: this.qs.stringify(arr)
                        })
                        // .post("/api/add.do",this.qs.stringify(arr))
                            .then(function (response) {
                                console.log("成功" + response);

                                if (response.data.resultFlag == "success") {
                                }
                            })
                            .catch(function (error) {
                                console.log("失败,,,", error);
                            });

后台使用String接收 再转成你要的List<T>

    public void setProductCoreListString(String productCoreListString) {
        this.productCoreListString = productCoreListString;
        if (!StringUtils.isEmpty(this.productCoreListString)) {
            ObjectMapper mapper = new ObjectMapper();
            try {
                List<ProductCore> list = mapper.readValue(productCoreListString, new TypeReference<List<ProductCore>>() {
                });
                productCoreList = list;
            } catch (IOException e) {
                e.printStackTrace();
                log.error("[setProductCoreListString]:"+e,toString());
            }
        }
    }

    private String productCoreListString;


 

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
如果前端使用Vue传递一个字符串数组后端可以通过以下方式进行接收: 1. 获取请求体中的参数,并将其转换为数组 ```javascript // Node.js Express 代码示例 const express = require('express'); const bodyParser = require('body-parser'); const app = express(); app.use(bodyParser.json()); app.post('/api/data', (req, res) => { const data = req.body.data.split(','); // 将逗号分隔的字符串转换为数组 console.log(data); // do something with data }); app.listen(3000, () => { console.log('Server is running at http://localhost:3000'); }); ``` 在以上代码中,我们首先通过body-parser中间件解析请求体中的JSON数据,并获取到参数`data`的值,该值是一个逗号分隔的字符串。接着,我们使用`split`方法将该字符串转换为数组。 2. 直接将字符串数组作为请求体参数 ```javascript // Node.js Express 代码示例 const express = require('express'); const bodyParser = require('body-parser'); const app = express(); app.use(bodyParser.json()); app.post('/api/data', (req, res) => { const data = req.body; // 直接获取请求体中的参数 console.log(data); // do something with data }); app.listen(3000, () => { console.log('Server is running at http://localhost:3000'); }); ``` 在以上代码中,我们直接将请求体中的参数作为一个对象进行获取,该对象包含一个名为`data`的属性,该属性的值是一个字符串数组后端可以直接使用该数组进行后续操作。 需要注意的是,如果前端传递的是一个JSON字符串,后端需要先将其解析为一个JavaScript对象或数组,才能够进行操作。可以使用`JSON.parse`方法将其转换为对应的JavaScript对象或数组

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值