使用不带[[]`s的vue-resource编码多个查询参数

Question

我正在通过以下方式使用vue-resource's $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的查询参数serialize函数的内部实现，我可以说-不，没有办法在vue-resource中自定义查询参数序列化函数。

有no standard way通过查询字符串传递值的集合，因此格式更特定于框架。尽管vue-resource和axios在默认情况下都使用方括号格式来序列化数组，但是第二个允许通过paramsSerializer选项配置自定义查询序列化功能。

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

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

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

或者这是来自another answer的自定义函数的示例，但已根据您的要求进行了修改：

JSFiddle