Question

我需要从API获取一些数据。我将对象的参数作为“参数”传递。该对象动态生成，当值是字符串时，我的请求运行良好，但是我有一个数组作为键，这是请求值的范围。因此，我需要以“ Some_data = 1000-3500”的方式传递来自数组的数据。我可以用哪种方式做到这一点？

let myParamsObj = {
   data: 'str',
   otherData: 'qwerty',
   half: 4,
   rangeData: [100, 400]
}

axios.get('/api/dasd?', { 
   params: myParamsObj,
   paramsSerializer: params => {
      return this.qs.stringify(params, {arrayFormat: 'repeat'})
   }
})

我希望将数组数据以这种方式插入到url中＆rangeData = 100-400 ＆data = str＆otherData = qwerty＆half = 4＆rangeData = 100-400

Answer 1

为什么不创建自己的URL参数字符串。像这样：

let myParamsObj = {
   data: 'str',
   otherData: 'qwerty',
   half: 4,
   rangeData: [100, 400]
}

let urlStr = ''

for (const key in myParamsObj) {
  urlStr += '&' + key + '='
  if (!Array.isArray(myParamsObj[key])) {
    urlStr += myParamsObj[key]
  } else {
    urlStr +=  myParamsObj[key][0] + '-' + myParamsObj[key][1]
  }
} 

console.log(urlStr)

更新1

我已经以这种方式完成了，但是由于axios文档，您只能将params作为对象传递。这就是为什么我要处理它

为此，您可以检查并修改myParamsObj以查看其是否具有数组，然后将其传递给下一个。我们只检查rangeData属性，如果属性存在，我们将修改属性本身，以便当axios函数将其字符串化时，它会以您想要的格式显示。像这样的东西：

let myParamsObj = {
   data: 'str',
   otherData: 'qwerty',
   half: 4,
   rangeData: [100, 400]
}

if (myParamsObj.hasOwnProperty('rangeData')) {
  myParamsObj.rangeData = myParamsObj.rangeData[0] + '-' + myParamsObj.rangeData[1]
}

console.log(myParamsObj)

更新2

密钥也要更新，我不知道哪个密钥名称它会包含。以某种方式，我需要检查对象属性是否数组并将其转换为字符串，例如100-400

在这种情况下，您可以结合使用以上两种解决方案以使其工作。像这样：

let myParamsObj = {
   data: 'str',
   otherData: 'qwerty',
   half: 4,
   rangeData: [100, 400]
}

for (const key in myParamsObj) {
  if (Array.isArray(myParamsObj[key])) {
    myParamsObj[key] = myParamsObj[key][0] + '-' + myParamsObj[key][1]
  }
}

console.log(myParamsObj)

Answer 2

如果您不知道要以这种方式序列化的属性，则可以改用filter选项并实现所需的任何逻辑。例如，以下代码将自定义序列化逻辑应用于任何长度为2的数组。

axios.get("/api/dasd?", {
  params: myParamsObj,
  paramsSerializer: params => {
    return this.qs.stringify(params, {
      filter: (prefix, value) => {
        const isTuple = Array.isArray(value) && value.length === 2;

        return isTuple ? `${value[0]}-${value[1]}` : value;
      }
    });
  }
});

如何将数组中的数据作为范围路径

2 个答案: