黑豹程序员-axios+springmvc传递数组

问题

奇怪的现象,axios在往后台传递数组时,springmvc竟然接收不到

解决

尝试多次无果,突然看一篇文章写vue中的数组不是真正的数组需要强转转化JSON.stringify

将信将疑下测试了一把,还真的传递成功了。

不光要JSON.stringify还要使用qs.stringify(把参数转为查询串)

还有小BUG,JSON.stringify后,会把数组的[]括号变成字符串元素的一部分。

这个就只能自己截串、替换处理。

实现前台传递一个单值和一个数组

vue前端代码

bash 复制代码
// 共用数据
import axios from '../sys/frame/axios.js'
import qs from 'qs'

import { serverURI } from './server-uri.js'
const server_uri = serverURI("basic")

//将参数转换为查询参数串提交
//注意下面坑,先要转换为js真正的数组,否则接参为null
export const SendMail = async (mails)=>{
	//数据非常怪异,转换字符串后,前面后面的双引号无用
	let tmp = JSON.stringify(mails).replaceAll("\"","")
	tmp = tmp.substring(1, tmp.length-1)		//去掉数组俩边的[和]
	let data = {code: '001', tags: tmp}

	console.log(mails)
	console.log(tmp)

	axios.post(server_uri+'/mail/sender',  qs.stringify(data)).then(resp => {
		console.log(resp.data)
	})
}

SpringMVC 后端代码

bash 复制代码
@RestController
@CrossOrigin
public class MailController {
    @PostMapping("/basic/mail/sender")
    public R sender(String code, String[] tags){
        return R.success("邮件发送成功");
    }
}
相关推荐
毛骗导演2 分钟前
OpenClaw Gateway RPC 运行时:一个 WebSocket 协议引擎的深度解剖
前端·架构
码路飞3 分钟前
不会 Rust 也能玩 WebAssembly:3 个 npm install 就能用的 WASM 神器
前端·javascript·webassembly
sudo_jin4 分钟前
从“输入网址”到“帧级控制”:我对事件循环与主线程管理的终极认知
前端·javascript
flyfox5 分钟前
Kiro AI IDE 深度使用指南:从入门到高效开发
前端·人工智能·ai编程
lovingsoft6 分钟前
Cursor Skills 实战教程:解锁AI编码效率,附多场景案例
前端·人工智能
小凡同志10 分钟前
React vs Vue:两种前端架构哲学的深度解析
前端·vue.js
miss12 分钟前
Vue2 老项目上 TS?这 10 个坑我替你踩了,附完整迁移方案
前端
小码哥_常12 分钟前
RecyclerView深坑大揭秘:FlexboxLayoutManager引发的滑动误判
前端
Neptune114 分钟前
让我带你迅速吃透React组件通信:从入门到精通(中篇)
前端·react.js·面试
bluceli15 分钟前
CSS子选择器与伪类:精准控制元素样式的利器
前端·css