問題
當我們需要通過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;