vue获取post参数,vue get传数组
本文主要介绍vue中get方法\post方法如何实现数组参数的传递，有很好的参考价值，希望对大家有所帮助。如有错误或不足之处，请不吝赐教。
目录
get方法\post方法如何传递数组参数第一部分：vue中get方法如何传递数组参数。下面列出了我的接口格式和解决方案的源代码。vue get和post参数传递方法1.post:通过数据传递参数2.get:通过params传递参数3.delete:params传递参数
get方法\post方法如何传递数组参数
背景：项目中突然来了一个post方法传递数组array的参数，数组的参数以get方法传递参数的形式通过一个循环中的所有元素传递，这对于小白来说确实是一个打击。但是，为了完成任务，所以不能放弃。于是通过搜索找到了答案(非常感谢小伙伴雷总的热心帮助和bubuko.com的回答)。
第一部分：vue中get方法如何传递数组参数
将数组直接传递给对象。
导出函数getcraplicationlist(data){
var测试=[111 ， 222]
退货请求({
URL:“/申请人/申请/列表”，
方法：“get”，
参数：{ test }
})
}
传递的参数格式如下：
但在这种情况下，后台无法获取值。我们需要将数组更改为以下格式：
测试：111
测试：222
首先找到axios.js并添加以下代码：
if (config.method===get) {
//如果是get请求，并且params是arr=[1，2]之类的数组类型，则转换为arr=1arr=2。
config . paramsserializer=function(params){
return qs.stringify(params，{ arrayFormat: repeat })
}
}
如果get请求中的参数是数组格式的，那么数组中每一项的属性名将被重用。
效果如下：
同样的，post方法传get方法的传参格式时候通用该方法。
下面列出我的接口格式及解决方法的源码
封装接口部分：
/**
* @description将array[]数组作为post请求传递。
* @param {Array[integer]} idList
* @param {integer}订单Id
* @return {*}
*/
导出函数doFuncTest(idListVal，orderId) {
退货请求({
URL:“/xxxx/XXX”，
方法： post ，
base URL:“//192.168 . XXX . XXX:xxxx/XXX/XXX/XXX”，
参数：{
idList: idListVal，
订单编号：订单编号
}
})
}
拦截器部分：
if (config.method===post) {
config . paramsserializer=function(params){
return qs.stringify(params，{ arrayFormat: repeat })
}
}
的最后访问地址如下：
http://192.168 . XXX . XXX:xxxx/XXX/XXX/XXX/xxxx/XXX？idList=261idList=262orderId=59
结束！
vue get与post传参方式
在vue的封装接口中，post和get的参数传递方式是不同的。
1.post:用data传递参数
/**
*添加动物种类
* @param {*} params
* @返回
*/
导出函数AddAnimalType (params) {
退货请求({
url: baseUrl /addAnimalType ，
方法： post ，
数据：参数
})
}
呼叫代码：
下面的this.formData是Data中定义的列表，包含id等信息。
//新建
insertAnimalType () {
AddAnimalType(this.formData)。然后(response={
if (response.status==0) {
成功消息(response.statusText)
}
否则{
errMessage(response.statusText)
}
}).catch(错误={
errorCollback(错误)
})
},
2.get:用params传递参数
/**
*根据Id获取详细信息
* id id
* @param {*} params
* @返回
*/
导出函数selectById (params) {
退货请求({
url: baseUrl /selectById ，
方法：“get”，
参数
})
}
调用接口：
//获取详细信息
getDetail () {
select byid({ animalId:this . formdata . id })。然后(response={
if (response.status==0) {
this . formdata=response . data . animaltype
}
否则{
errMessage(response.statusText)
}
}).catch(错误={
errorCollback(错误)
})
},
3.delete:params传递参数
导出函数deleteAnimalType (params) {
退货请求({
url: baseUrl /delete ，
方法：“删除”，
参数
})
}
调用接口：
要删除(id) {
Console.log(在操作中单击删除)
这个。$confirm(该操作将永久删除该数据。你想继续吗？提示，{
ConfirmButtonText:确定，
CancelButtonText:取消，
类型："警告"
})。然后(()={
deleteAnimalType({ animalIds:id }).然后((响应)={
if (response.status==0) {
成功消息(response.statusText)
}否则{
errMessage(response.statusText)
}
}).接住(错误)={
错误返回(错误)
})
})
},
以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。