qs.stringify、qs.parse、JSON.stringify的使用和区别

格式化数组参数的三种方法:

qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' })

// 'a[0]=b&a[1]=c'

qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' })

// 'a[]=b&a[]=c'

qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' })

// 'a=b&a=c'


qs.stringify(dataObj) 解析嵌套的对象,默认会进行编码

let obj={ a:['b','c','d'] }

console.log(qs.stringify(obj));//结果为:a%5B0%5D=b&a%5B1%5D=c&a%5B2%5D=d

可以设置不编码encode:false    

let obj={ a:['b','c','d'] }

console.log(qs.stringify(obj, {encode:false}));//结果为: a[0]=b&a[1]=c&a[2]=d


对数组进行串化的时候,默认会提供显示索引,可以通过设置indices:false

let obj={a:['b','c','d']};qs.stringify(obj,{indices:false});//结果为:'a=b&a=c&a=d'


可以通过设置arrayFormat指定数组的输出格式

let obj={{a :[' b ',' c ']};

qs.stringify(obj,{arrayFormat:'indices'});//结果为:'a[0]=b&a[1]=c'

qs.stringify(obj,{arrayFormat:'brackets'});//结果为:'a[]=b&a[]=c'

qs.stringify(obj,{arrayFormat:'comma'});//结果为:'a=b,c'


属性为undefined的将直接被忽略

let obj={a :null ,b:undefined};qs.stringify(obj);//结果为:'a='


分隔符也可以自定义,设置delimiter:‘自定义的符号’

let obj={a:'b',c:'d'};qs.stringify(obj,{delimiter:'!'});//结果为:'a=b!c=d'



  

解决方案
自己处理
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://www.cnblogs.com/webljl/p/15401969.html