Vue :axios请求post、get请求根据后参数类型进行传参
在Vue中使用axios发送POST和GET请求时,传参的方式取决于HTTP请求的头部Content-Type的设置。以下是两种常见的Content-Type类型以及如何使用axios发送带参数的请求。
- 应用/json类型(通常用于POST请求):
axios.post('/api/data', {
key1: 'value1',
key2: 'value2'
}, {
headers: {
'Content-Type': 'application/json'
}
})
.then(response => {
// 处理响应数据
})
.catch(error => {
// 处理错误情况
});
- 表单数据编码(通常用于POST请求,适用于application/x-www-form-urlencoded):
axios.post('/api/data', qs.stringify({
key1: 'value1',
key2: 'value2'
}), {
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
.then(response => {
// 处理响应数据
})
.catch(error => {
// 处理错误情况
});
对于GET请求,参数会附加在URL后面,不需要特别指定Content-Type:
axios.get('/api/data', {
params: {
key1: 'value1',
key2: 'value2'
}
})
.then(response => {
// 处理响应数据
})
.catch(error => {
// 处理错误情况
});
以上代码中,axios.post
和axios.get
是axios提供的方法用于发送POST和GET请求,qs.stringify
是qs库提供的方法,用于将JavaScript对象序列化为URL编码的字符串,通常在发送application/x-www-form-urlencoded
类型的数据时使用。
评论已关闭