axios 中 qs 的使用
qs
- 一、请求写法
- 二、qs
* 2. 使用* * 1\. 对比
场景:
在看代码的时候看到如下代码的时候,碰到两个问题,一个是这个请求的写法,第二个就是qs;
// request 就是 axios 对象
export function getVerifyCode(telephone) {
return request({
url: '/......',
method: 'post',
data: qs.stringify({
PhoneNumber: telephone,
}),
});
}
* 1
* 2
* 3
* 4
* 5
* 6
* 7
* 8
* 9
* 10
一、请求写法
之前使用 axios请求数据,写法都是下边这种的;
axios.post('url',
{
key: val
})
.then((res)=>{
console.log(res)
})
.catch((error)=>{
console.log(error)
})
* 1
* 2
* 3
* 4
* 5
* 6
* 7
* 8
* 9
* 10
后来查了一下文档,发现是有这种写法的;
// 发送 POST 请求
axios({
method: 'post',
url: '/user/12345',
data: {
firstName: 'Fred',
lastName: 'Flintstone'
}
});
// 发送 GET 请求(默认的方法)
axios('/user/12345');
* 1
* 2
* 3
* 4
* 5
* 6
* 7
* 8
* 9
* 10
* 11
* 12
二、qs
看到 qs.stringify()
这个方法,我第一时间想到的是 JSON.stringify()
;
1. 对比
qs.stringify()
将对象 序列化成URL的形式,以&进行拼接。
JSON是正常类型的JSON,请对比一下输出;
var a = {name:'hehe',age:10};
qs.stringify(a)
// 'name=hehe&age=10'
JSON.stringify(a)
// '{"name":"hehe","age":10}'
* 1
* 2
* 3
* 4
* 5
* 6
* 7
2. 使用
步骤:
1、首先先下载:
npm i qs
* 1
2、然后引入 :
import qs from 'qs'
* 1
3、qs主要有两个方法 :
方法一:将对象序列化,多个对象之间用&拼接(拼接是由底层处理,无需手动操作)
qs.stringify() 转换成查询字符串
let comments = {content: this.inputValue}
let comValue = qs.stringify(comments)
* 1
* 2
* 3
方法二:将序列化的内容拆分成一个个单一的对象
qs.parse() 转换成json对象
let comValue = qs.parse(comments)
* 1
* 2
* 3
0 评论