qs的用法

342 阅读1分钟

qs就是处理url中的参数

一、在vue中使用qs

1.先进行安装npm install qs

2.在main.js中全局引入

import qs from 'qs'
// 全局定义
Vue.prototype.$qs = qs
二、序列化方法
  1. qs.parse(): 将URL解析成对象的形式
let url = 'a=1&b=2&c=&d=xxx&e';
let data = qs.parse(url);
// data的结果是 
{ a: 1, b: 2, c: '', d: xxx, e: '' }
  1. qs.stringify(): 将对象 序列化成URL的形式,以&进行拼接
let data = qs.stringify({ 
    "username":'gg', 
    "password":'123456'
});
// data的结果是
username=gg&password=123456
三、不常用的方法
let params = [0, 5, 7];

// indices(默认)
qs.stringify({a: params}, {
    arrayFormat: 'indices'
})
// 结果是
'a[0]=0&a[1]=5&a[2]=7'

// brackets 
qs.stringify({a: params}, {
    arrayFormat: 'brackets'
})
// 结果是
'a[]=0&a[]=5&a[]=7'

// repeat
qs.stringify({a: params}, {
    arrayFormat: 'repeat'
})
// 结果是
'a=0&a=5&a=7'

  1. 处理json数据
let json = { a: { b: { c: 'd', e: 'f' } } };
qs.stringify(json);
//结果 
'a[b][c]=d&a[b][e]=f'

2.其他:如果不能处理,需要转换一下

qs.stringify(json, {allowDots: true});
//结果 
'a.b.c=d&a.b.e=f'

参考文章:# qs.js的用法详解# Vue中使用qs