关于前端数组对象传输给后端的最全解决方法
话说啥是前后端分离中最容易出现问题的,莫过于两端之间的数据传输了(个人观点)话不多说,直接上教程1.前端数组处理在这里我们需要先将前端数组对象字符串化先来看看目前的数组对象的格式接下来将数组对象字符串化let pv=JSON.stringify(this.$refs.pv.pvImage)this.$refs.pv.pvImage就是我们这里说的数组对象字符串话后的值如下图所示:接下来使用axio
·
话说啥是前后端分离中最容易出现问题的,莫过于两端之间的数据传输了(个人观点)
话不多说,直接上教程
1.前端数组处理
在这里我们需要先将前端数组对象字符串化
先来看看目前的数组对象的格式
接下来将数组对象字符串化
let pv=JSON.stringify(this.$refs.pv.pvImage)
this.$refs.pv.pvImage就是我们这里说的数组对象
字符串话后的值如下图所示:
接下来使用axios通信组件,向后端发送数据
这里需要注意的是,不能够直接使用变量传值,因为注意我们目前的值不是一个对象了,他就是一个简单的字符串,所以需要使用键值对赋值传输:
const res=await this.axios.post('http://localhost:8086/啦啦啦',this.$qs.stringify({
pv:pv
}))
2.后端
前端的值准备好了,我们后端需要写相应的API进行接收,如下图所示
@RequestMapping("/getUserConfirmPV")
JsonObject getUserConfirmPV(String pv){}
我们先输出一下pv,pv值是可以接收到值得,但是输出确实一个字符串,而我们需要的是一个List列表,所以我们需要对pv字符串进行相关编译,很简单,根据字符串中得“ {} ,来进行正则切割,可以自己写个工具类来处理。
在这里直接使用fastjson
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.75</version>
</dependency>
然后使用fastJson处理
List<phimgPojo> parse =JSON.parseArray(pv,phimgPojo.class);
for (phimgPojo phimgPojo : parse) {
System.out.println(phimgPojo.toString());
}
注意这里得phimgPojo是你对应得javabean类
然后循环输出一下:
好了,我们可以看到数据已经可以成功输出了
更多推荐
已为社区贡献9条内容
所有评论(0)