vue使用axios的post提交方式,参数为数组

前两天同事写项目时,遇到一个问题。项目为vue的项目,axios提交post请求,后端收到的参数格式不正确。

同事提交的参数如下:

a[0]: 1,
a[1]: 2,
a[2]: 3

后端需要的的参数格式:

a[]: 1,
a[]: 2,
a[]: 3

查阅各种资料后,发现使用qs对参数进行序列化方式是最方便的。

使用qs对字符串进行序列化默认格式:
qs.stringify({ a: [1, 2, 3] });
//  'a[0]=1&a[1]=2&a[2]=3'
通过设置indices为false可以实现如下效果
qs.stringify({ a: [1, 2, 3] }, { indices: false });
//  'a=1&a=2&a=3'
而我们后端希望的数据格式,可以通过arrayformat来实现:
qs.stringify({ a: [1, 2, 3 ] }, { arrayFormat: 'indices' });
//  'a[0]=1&a[1]=2&a[2]=3'

qs.stringify( { a: [1, 2, 3 ]} , { arrayFormat: 'brackets' });
//  'a[]=1&a[]=2&a[]=3'

qs.stringify( {a: [1, 2, 3 ]}, { arrayFormat: 'repeat' } );
//  'a=1&a=2&a=3'

更多qs功能参考以下网址:
https://www.npmjs.com/package/qs

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。