Passing array into URLSearchParams while consuming http call for get request
In fact, you can't pass an array directly but you can use several times the append method:
let params = new URLSearchParams();params.append('arrayparams', 'val1');params.append('arrayparams', 'val2');params.append('arrayparams', 'val3');console.log(params.toString());
URLSearchParams can be passed a sequence of pairs, so to have an array of values:
var ids = [1,2,3,4]var search = new URLSearchParams(ids.map(s=>['id',s]))var searchString = search.toString()// "id=1&id=2&id=3&id=4"// To get the ids from the URL search stringvar search_ids = [...search.getAll('id')]
I've used Lodash map to iterate over objects/arrays and append the params dynamically.
const buildParams = (data) => { const params = new URLSearchParams(); map(data, (value, key) => { if (Array.isArray(data[key])) { map(value, item => params.append(key, item)); } else { params.append(key, value); } }); return params;};const params = { foo: ['a', 'b', 'c'], bar: 'xyz'}const doFetch = fetch(`http://api.com/search?${buildParams(params)}`)So the final URL will look like: http://api.com/search?foo=a&foo=b&foo=c&bar=xyz