axios传递数组参数爬坑总结
总结一下正确的传数组参数应该如下,瞅代码：
引用
import axios from 'axios'
import qs from 'qs'
get / delete请求方式解决方式如下
axios.get(url, {
params: {
ids: [1,2,3],
type: 1
},
paramsSerializer: params => {
return qs.stringify(params, {
indices: false })
}})
axios.delete(url, {
params: {
ids: [1,2,3],
type: 1
},
paramsSerializer: params => {
return qs.stringify(params, {
indices: false })
}})
post / put 请求方式解决方式如下
axios.post(url, qs.stringify(
params: {
ids: [1,2,3],
type: 1
}, {
indices: false }))
axios.put(url, qs.stringify(params: {
ids: [1,2,3],
type: 1
}, {
indices: false }))
其余类似。这样一来，数组参数就会转换为如下的形式
url?ids=1&ids=2&id=3
后台接口接收
(1)数组类型(int[])接收结果
[1,2,3]
(1)字符串形式(String)接收结果
1,2,3
大功告成！
当然，这只是一种形式，大概有4种形式：
qs.stringify({
ids: [1, 2, 3]}, {
indices: false })
//形式： ids=1&ids=2&id=3
qs.stringify({
ids: [1, 2, 3]}, {
arrayFormat: ‘indices‘})
//形式： ids[0]=1&aids1]=2&ids[2]=3
qs.stringify({
ids: [1, 2, 3]}, {
arrayFormat: ‘brackets‘})
//形式：ids[]=1&ids[]=2&ids[]=3
qs.stringify({
ids: [1, 2, 3]}, {
arrayFormat: ‘repeat‘})
//形式： ids=1&ids=2&id=3
最后，对axios进行了一个封装,方便自己使用：
import axios from 'axios'
import qs from 'qs'
let baseurl = 'http://localhost:8081/api'
function getRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
let req = axios.get(url, {
params: params,
paramsSerializer: params => {
return qs.stringify(params, {
indices: false })
}})
thenResponse(req, successCallback, errorCallback)
}
function postRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
let req = axios.post(url, qs.stringify(params, {
indices: false }))
thenResponse(req, successCallback, errorCallback)
}
function putRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
// var params = new URLSearchParams()
// params.append('status', 0)
let req = axios.put(url, qs.stringify(params, {
indices: false }))
thenResponse(req, successCallback, errorCallback)
}
function deleteRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
let req = axios.delete(url, {
params: params,
paramsSerializer: params => {
return qs.stringify(params, {
indices: false })
}})
thenResponse(req, successCallback, errorCallback)
}
/**
* 请求结果处理
* @param axiosRequest
* @param successCallback
* @param errorCallback
*/
function thenResponse (axiosRequest, successCallback, errorCallback) {
axiosRequest.then((res) => {
if (res.status === 200) {
res = res.data
if (res.code === 0) {
if (successCallback) successCallback(res)
} else {
if (errorCallback) errorCallback(res.code, res.msg)
}
}
}).catch((error) => {
if (errorCallback) errorCallback(-1, error.message)
})
}
export {
getRequest, postRequest, putRequest, deleteRequest }
使用:
//导入封装axios的js文件
import {
getRequest, deleteRequest} from 'utils/api'
//发送delete请求，带数组参数 与 普通参数
deleteRequest('/admin/user/del', {
token: ‘SDFSDIFJSIODFKMSDOFM,SDOPFK’,
ids: [1,2,3,4,5,6]
}, function (res) {
_this.$alert('删除成功')
}, function (errcode, errmsg) {
_this.$alert('code ' + errcode + ' ,meaasge ' + errmsg)
})
//发送GET请求
getRequest('/admin/users', {
status: 0,
pageNum: this.currentPage,
pageSize: count,
token: '111'
}, function (res) {
_this.totalPage = res.data.total
}, function (errcode, errmsg) {
_this.$alert('code ' + errcode + ' ,meaasge ' + errmsg)
})
作者：黄二狗V
链接：https://www.jianshu.com/p/68d81da4e1ad
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。