黑豹程序员-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("邮件发送成功");
    }
}
相关推荐
没有鸡汤吃不下饭7 分钟前
前端打包出一个项目(文件夹),怎么本地快速启一个服务运行
前端·javascript
liusheng10 分钟前
Capacitor + React 的 iOS 侧滑返回手势
前端·ios
CUYG21 分钟前
v-model封装组件(定义 model 属性)
前端·vue.js
子洋24 分钟前
基于远程开发的大型前端项目实践
运维·前端·后端
用户350201588474827 分钟前
基于react-routet v7 的配置式 + 约定式路由系统 第一步:引入react-routerv7
前端
用户350201588474829 分钟前
基于react-routet v7 的配置式 + 约定式路由系统 第二步:一个简单的约定式路由系统
前端
攀登的牵牛花33 分钟前
前端向架构突围系列 - 框架设计(七):反应式编程框架Flower的设计
前端·架构
佛系打工仔36 分钟前
K线绘制前言
前端
遇见~未来1 小时前
JavaScript数组全解析:从本质到高级技巧
开发语言·前端·javascript
石像鬼₧魂石1 小时前
80 端口(Web 服务)渗透测试完整总结(含踩坑 + 绕过 + 实战流程)
linux·运维·服务器·前端·网络·阿里云