问题

当我们需要通过get方式传递一个数组作为参数 tag:[1,2,3,4]

预期是解析为:https://www.cnblogs.com/enter?tag=1&tag=2&tag=3&tag=4

然而真相是这样的:https://www.cnblogs.com/enter?tag[]=1&tag[]=2&tag[]=3&tag[]=4,后台是不可能解析到传递的参数。

解决方案

自己处理

axios.get("https://www.cnblogs.com/enter",{
params: {
keys:this.tag
 
},
paramsSerializer: function(params) {
const keys= params.keys.map(_=>`keys=${_}`).join('&');
return `${keys}` ;
}
}).then((res)=>{
//成功后的处理
});

qs插件

1、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' })
// 输出结果:'a[0]=b&a[1]=c'
2、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' })
// 输出结果:'a[]=b&a[]=c'
3、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' })
// 输出结果:'a=b&a=c'
4、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'comma' })
// 输出结果:'a=b,c'

axios配置

axios.interceptors.request.use(async (config) => {
//只针对get方式进行序列化
 if (config.method === 'get') {
   config.paramsSerializer = function(params) {
     return qs.stringify(params, { arrayFormat: 'repeat' })
   }
 }
}

小程序

 let urlQueryString = qs.stringify(options.params, {   //使用到qs ,先下载,后引入
      addQueryPrefix: true,
      allowDots: true,
      arrayFormat: 'repeat'
    });
    myUrl += urlQueryString;

参考

https://github.com/ljharb/qs

posted on 2020-04-06 11:25  kingreatwill  阅读(70117)  评论(0编辑  收藏  举报