Multiple fields with same key in query params (axios request)?

Adding more details to @nhydock accepted answer. When you do

var request = {foo: [5, 2, 11] }

axios.get('http://example.com/', request);

For django application you can receive these as

self.request.query_params.getlist('foo')

also.

From the Request Config section of the axios documentation:

  // `params` are the URL parameters to be sent with the request
  // Must be a plain object or a URLSearchParams object
  params: {
    ID: 12345
  },

To use this in a request, you would do

const request = {
  params: {
    foo: [5, 2, 11]
  }
}
axios.get('http://example.com/', request);

The issue with using a plain object is that array parameters are added as

http://example.com/?foo[]=5&foo[]=2&foo[]=11

To make a request to a URL without the [], use URLSearchParams

var params = new URLSearchParams();
params.append("foo", 5);
params.append("foo", 2);
params.append("foo", 11);
var request = {
  params: params
};
axios.get('http://example.com/', request);

This will result in a request to

http://example.com/?foo=5&foo=2&foo=11

In Axios request config, you can override params serialization and then use QS NPM module to serialize array with repeat mode

let params = { foo: [5, 2] }

axios.get('path/to/api/',{params}) // URL : https://path/to/api?foo[]=5&foo[]=2

let myAxios = axios.create({
    paramsSerializer: params => Qs.stringify(params, {arrayFormat: 'repeat'})
})
myAxios.get('path/to/api/',{params}) // URL : https://path/to/api?foo=5&foo=2