使用 vue-resource 对多个查询参数进行编码，不带 '[]'

Question

我通过以下方式使用 vue-resource 的$http.get查询 REST API：

this.$http.get('/api', {
params: {
id: [1,2,3],
},
});

这将产生查询

/api?id[]=1&id[]=2&id[]=3

但我的端点期望

/api?id=1&id=2&id=3

有没有办法告诉vue-resource像这样编码多个参数？

我想避免构造自己的查询字符串，但这是我能想到的替代方案。

Answer 1

通过查询参数序列化函数的内部实现vue-resource，我可以说 - 不，没有办法在vue-resource中自定义查询参数序列化函数。

没有通过查询字符串传递值集合的标准方法，因此格式更特定于框架。虽然默认情况下vue-resource和axios都使用括号格式来序列化数组，但第二个允许通过paramsSerializer选项配置自定义查询序列化函数。

猜猜，没有标准的主要原因是因为在前端创建自定义函数来序列化查询参数非常容易。

您可以使用 qs.js 库来解决您的问题

qs.stringify({ a: ['b', 'c', 'd'] }, { indices: false });

或者这里是来自另一个答案的自定义函数的示例，但根据您的请求进行了修改：

JSFiddle